Avatar billede d.kryger Praktikant
18. oktober 2004 - 12:57 Der er 14 kommentarer og
1 løsning

Billede skifter ved klik

Hej eksperter...

Jeg har en side hvor jeg gerne vil have at billedet (1.gif skifter til 2.gif, når man har klikket på det.

<a href="side.php"><img src="1.gif" style="position: absolute; left: 100px; top: 200px" border="0"></a>

Hvordan laver man det?
Avatar billede ldanielsen Nybegynder
18. oktober 2004 - 13:05 #1
<img src="1.gif" style="position: absolute; left: 100px; top: 200px" border="0" onclick="this.src = '2.gif';">
Avatar billede roenving Novice
18. oktober 2004 - 13:07 #2
-- og du behøver ikke a-tagget rundt om:

<img src="1.gif" style="position:absolute;left:100px;top:200px;cursor:pointer" onclick="this.src=(this.src.indexOf('1.gif')>-1)?'2.gif':'1.gif';location.href='side.php'">
Avatar billede ldanielsen Nybegynder
18. oktober 2004 - 13:13 #3
Men jeg forstår ikke ....

Du bruger billedet som link, så når du klikker på det, så går du videre til en anden side. Hvorfor skulle billedet så skiftes ud?
Avatar billede d.kryger Praktikant
18. oktober 2004 - 13:14 #4
Det er i et andet target...
Læg et svar og du får point...
Avatar billede d.kryger Praktikant
18. oktober 2004 - 13:23 #5
Oplysning: 1.gif er en prik, og 2.gif er en prik er blinker. 3.gif er en anden prik, og 4.gif er en anden prik er blinker.

Jeg har flere billeder på siden, og 2.gif eller 4. gif må kun vises én sted på siden af gangen.

Kan dette lade sig gøre og forstår i mig?
Avatar billede roenving Novice
18. oktober 2004 - 13:35 #6
Ja, det er ikke svært at lave den slags menu-funktioner, men måske kan opgaven begrænses, hvis alle dine menu-billeder ligger i det samme element !-)

F.eks.

<script type="text/javascript">
function chImage(img,foer,efter){
  var im = document.getElementsByTagName('IMG');/*her kunne man nøjes med at kigge i menu-diven !-)*/
  for(i=0;im.length>i;i++){
    if(im[i].src.indexOf(efter)>-1)im[i].src = foer;
  }
  img.src = efter;
}
</script>

-- og så f.eks. sådan på dine billeder:

<img src="1.gif" style="position:absolute;left:100px;top:200px;cursor:pointer" onclick="chImage(this,'1.gif','2.gif');parent.FRAMENAVN.location.href='side.php'">
Avatar billede d.kryger Praktikant
18. oktober 2004 - 13:55 #7
Hej roenving... Det virker fint sålænge jeg holder mig til 1 sæt billder (forstået 1.gif og 2. gif) MEN når jeg også bruger 3/4, virker det ikke helt efter hensigten... Har du en løsning på dette?
Avatar billede roenving Novice
18. oktober 2004 - 13:57 #8
Det virker da fint:

<img src="3.gif" style="position:absolute;left:100px;top:200px;cursor:pointer" onclick="chImage(this,'3.gif','4.gif');parent.FRAMENAVN.location.href='side.php'">

-- men det er måske sådan, at der kun må være ialt eet billede 2 eller 4 ?-)
Avatar billede d.kryger Praktikant
18. oktober 2004 - 13:59 #9
-- men det er måske sådan, at der kun må være ialt eet billede 2 eller 4 ?-)
Ja nemlig ja...
Avatar billede d.kryger Praktikant
18. oktober 2004 - 14:02 #10
Og lige én ting til... Det første billede (link) skal starte med at blike... Kan dette lade sig gøre?
Avatar billede roenving Novice
18. oktober 2004 - 14:08 #11
Det første billede sætter du bare til at have src="2.gif" !-)

-- nu ved jeg ikke hvor fleksibelt du vil have det, men f.eks. sådan:

<script type="text/javascript">
var imgs = ['1.gif','2.gif','3.gif','4.gif','5.gif','6.gif'];

function chImage(img,efter){
  var im = document.getElementsByTagName('IMG');/*her kunne man nøjes med at kigge i menu-diven !-)*/
  for(i=0;im.length>i;i++){
    for(j=0;imgs.length>j;j+=2){
      if(im[i].src.indexOf(imgs[j+1])>-1){
        im[i].src = imgs[j];
        break;
      }
    }
  }
  img.src = efter;
}
</script>

-- og:

<img src="1.gif" style="position:absolute;left:100px;top:200px;cursor:pointer" onclick="chImage(this,'2.gif');parent.FRAMENAVN.location.href='side.php'">
Avatar billede d.kryger Praktikant
18. oktober 2004 - 14:24 #12
Nu virker det som jeg gerne vil have det...
Læg et svar og du får point...
Avatar billede d.kryger Praktikant
18. oktober 2004 - 14:25 #13
MANGE tak for hjælpen...
Avatar billede roenving Novice
18. oktober 2004 - 14:39 #14
Velbekomme '-)
Avatar billede roenving Novice
18. oktober 2004 - 14:44 #15
-- 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
Vi tilbyder markedets bedste kurser inden for webudvikling

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.

Du kan også logge ind via nedenstående tjenester