Søg
Avatar billede super_glenn Nybegynder
19. juli 2004 - 20:43 Der er 10 kommentarer og
1 løsning

Rollover billeder

Hej Eksperter
Jeg skal lave en men som skal bestå af fire forskellige billeder der alle fire skifter til fire andre billeder når man føre musen hen over dem.
Her mit spørgsmål så hvordan gør man det skal jeg bruge java script, css eller hvordan?
Avatar billede dark-devil Nybegynder
19. juli 2004 - 20:52 #1
Det javascript, du kan dog også bruge css, og javascript.
Avatar billede roenving Novice
19. juli 2004 - 20:52 #2
Med javascript er det nemt:

<img src="pic_out.gif" onmouseover="this.src=pic_over.gif" onmouseout="this.src=pic_out.gif" onclick="alert('Her sætter du de actions du har brug for ved musetryk');" style="cursor:pointer;">
Avatar billede roenving Novice
19. juli 2004 - 20:53 #3
Hov, jeg glemte 4 gnyffer:

<img src="pic_out.gif" onmouseover="this.src='pic_over.gif'" onmouseout="this.src='pic_out.gif'" onclick="alert('Her sætter du de actions du har brug for ved musetryk');" style="cursor:pointer;">
Avatar billede super_glenn Nybegynder
19. juli 2004 - 20:57 #4
Roenving >> Det hvor jeg skal sættes actions ind... Det er vel i midt tilfælde bare <a> </a> hvis jeg skal bruge det som navigation?
Avatar billede jamiros Novice
19. juli 2004 - 21:02 #5
Her er til to billeder så kan du selv udvide den til fire ;-)

<html>
<head>
<title></title>
<script type="text/javascript">
<!--
pic1 = new Image(); pic1.src = "pic1.gif";
pic2 = new Image(); pic2.src = "pic2.gif";
pic3 = new Image(); pic3.src = "pic3.gif";
pic4 = new Image(); pic4.src = "pic4.gif";

function HoverPic(img_name,img_src) {
document[img_name].src=img_src;
}

// Slut -->
</script>
</head>
<body>

<div><a href="side.html" onmouseover="HoverPic('rel1','pic1.gif'); HoverPic('rel2','pic2.gif');" onmouseout="HoverPic('rel1','pic3.gif'); HoverPic('rel2','pic4.gif');" >
<img name="" src="pic.gif" border="0"></a>
<img name="rel1" src="pic1.gif" border="0">
<img name="rel2" src="pic2.gif" border="0">
</div>
</body>
</html>
Avatar billede roenving Novice
19. juli 2004 - 21:10 #6
>>super_glenn

Ikke nødvendigvis brug for a-tags (som også skal placeres udenom billedet !-)

-- for hvis du alligevel er afhængig af javascript (det kan ikke laves uden, så det er bare nogenlunde cross-browser), kan du ligesågodt bruge java script:

Åbn ny side i samme vindue/(i)frame:

<img src="pic_out.gif" onmouseover="this.src='pic_over.gif'" onmouseout="this.src='pic_out.gif'" onclick="location.href='denNySide.html';" style="cursor:pointer;">

Åbn ny side i samme vindue i en anden (i)frame:

<img src="pic_out.gif" onmouseover="this.src='pic_over.gif'" onmouseout="this.src='pic_out.gif'" onclick="parent.FRAMENAME.location.href='denNySide.html';" style="cursor:pointer;">

Linke til et andet site:

<img src="pic_out.gif" onmouseover="this.src='pic_over.gif'" onmouseout="this.src='pic_out.gif'" onclick="location.href='http://www.detAndetSite.html';" style="cursor:pointer;">

Åbne en side i et nyt vindue:

<img src="pic_out.gif" onmouseover="this.src='pic_over.gif'" onmouseout="this.src='pic_out.gif'" onclick="window.open('denNySide.html','nytVindue','width=400,height=300,left=200,top=200,scrollbars=no');" style="cursor:pointer;">
Avatar billede super_glenn Nybegynder
19. juli 2004 - 21:33 #7
temlig liret javascripting der :D smid et svar roenving!
Avatar billede jamiros Novice
19. juli 2004 - 21:39 #8
Jeg troede du skulle have ændret flere billeder på én gang?
Avatar billede roenving Novice
19. juli 2004 - 21:50 #9
Velbekomme '-)
Avatar billede super_glenn Nybegynder
19. juli 2004 - 23:58 #10
nej nej det skulle jeg ikke ;-)
Avatar billede roenving Novice
20. juli 2004 - 00:02 #11
-- og tak for point ;~}
Avatar billede Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Loading billede Opret Preview
Kategori
Webudvikling kurser
Vi tilbyder markedets bedste kurser inden for webudvikling
Se alle Webudvikling kurser

Flere spørgsmål fra HTML kategorien

Titel Indlæg Oprettet Seneste aktivitet
Hjælp med HTML og CSS Af Nojsa i HTML 18 10/09/202515:07 17/09/202515:11
CSS 2 x firkanter + tekst på samme linje Af nemlig i HTML 3 19/03/202522:16 20/03/202513:04
Se og ændre html på en webside Af magger i HTML 4 11/03/202513:55 12/03/202506:56
Få input felt, der er med fed skrift og formatteres på linje Af KurtG i HTML 5 02/03/202520:05 04/03/202515:40
Variabler som ikke virker Af Frits Jensen i HTML 3 30/10/202409:37 01/01/202515:27
Se alle spørgsmål i kategorien Opret spørgsmål

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Opret Log ind

Du kan også logge ind via nedenstående tjenester

Alle kategorier på Eksperten
Seneste spørgsmål Seneste aktivitet
I går 21:38 webui_forge_cu121_torch231 med AMD Grafikkort. Af jonpet i Andet software
I går 20:06 email adresse Af Malm i Forslag til ændringer
I går 19:54 problem med google crome Af Malm i Andet software
I går 09:36 Alternativ holder til to skærme... Af Don G i Skærme
20/0815:01 Samsung smart TV Af postpeter@outlook.dk i Fri debat
White papers
Flere white papers »