Kan någon hjälpa mig?
När personer skapat flera trådar med samma innehåll, brukar hjälpen utebli, Tänk på det tills nästa gång, Och om du har tur så kanske det finns någon som har överseende med dubbelpostningen och hjälper dig iallafall...
2 svar · 1 670 visningar · startad av danny1
Hej, försöker köra en Javascript när jag klickar på en bild. Vill gärna att "handen" skall synas utan att ha en ref till någon sida.
Jag har kodat så här:
<a href="#"><img src="docs/images/arrow_rght.jpg" border="0" onClick="next(); "> </a>
men efter klick öppnar jag en ny sida och det vill jag inte. Det enda intressanta här är: att handen skall synas, att jag kör JavaScript-funktionen utan att öppna en ny sida.
Kan någon hjälpa mig?
Hälsningar
Danny
Kan någon hjälpa mig?
När personer skapat flera trådar med samma innehåll, brukar hjälpen utebli, Tänk på det tills nästa gång, Och om du har tur så kanske det finns någon som har överseende med dubbelpostningen och hjälper dig iallafall...
Svar och råd
Kort svar: "handen" får du med CSS-regeln cursor: pointer
Längre råd. Undvik JavaScript som länk. Kolla begrepp som "unobtrusive" och "progressive enhancement".
Som det nu är funkar inte din kod för sökmotorernas botar, de som använder tangentbordet för att navigera eller någon som använder talsyntes. "Handen" syns inte för att du använt fel sätt att tackla problemet. Dessutom är ditt a-element är i dagsläget helt onödigt!
Jag antar att du tänkt dig någon slags slideshow. Följande kod borde ge dig en idé om hur det kan fungera. Först HTML:
<a href="sida_med_nästa_bild.html" class="next"><img src="docs/images/arrow_rght.jpg" alt="Nästa bild"></a>
Helt rent från CSS och JavaScript. "Keep 'em separate!"
Sedan CSS koden:
.next img {
border: none;}
Och skript, som körs "onload", enklast genom att lägga skript-elementet allra sist innan den avslutande body-taggen. Låna getElementsByClassName från Robert Nyman (Google) och kör följande själv-exekverande funktion:
(function() {
document.getElementsByClassName("next").onclick = next;
// Andra liknande händelsehanterare kan initieras på samma sätt här
})();
Lägg märke till att jag lägger händelsehanteraren på länk-elementet, inte på bilden, så att den fungerar med tangentbordet, såväl som musen. Dessutom, eftersom det i grund och botten är en riktig länk, så får du den pekare som du vill ha!
Själv-exekverande funktioner används för att inte "förorena" den globala namnrymden i JavaScript, dvs. denna konstruktion förhindrar att variabler och funktioner från ett skript stör ut ett annat skript.