Avatar billede rane Nybegynder
28. februar 2007 - 09:17 Der er 24 kommentarer og
1 løsning

Menu - udskift billede onclick

Jeg bruger en almindelige Switch Menu herfra: http://www.dynamicdrive.com/dynamicindex1/switchmenu.htm

i forbindelse med et udtræk fra en database, så menuen bliver genereret dynamisk. Som hovedpunkter bruger jeg billeder.

Jeg har brug for at:

- Udskifte hovedpunkt-billederne onclick (med filnavn_aktiv.gif)
- Den skal skifte billederne tilbage til de gamle hvis man klikker på dem igen.

Eksempel:
Jeg klikker på et tilfældigt hovedmenu-billede. Nu udskiftes billedet så man kan se at det er aktivt og samtidig vises underpunkter i tekst. Derefter klikker jeg på et andet hovedmenu-billede (eller det samme) som nulstiller det forrige "aktive" billede og viser evt. det nye aktive hovedmenu-billede.

Forvirrende?  Håber I forstår problemet og kan hjælpe med en løsning :)
Avatar billede roenving Novice
28. februar 2007 - 09:21 #1
Reloader du siden, ved valg i menuen ?-)
Avatar billede rane Nybegynder
28. februar 2007 - 09:27 #2
Nej det gøres vha. show/hide divs :)
Avatar billede roenving Novice
28. februar 2007 - 09:39 #3
Så f.eks.

<script type="text/javascript">
function switchPic(pic){
  pic.src = (pic.src.indexOf("_aktiv") > 0) ? pic.src.replace(/_aktiv/, "") : pic.src.replace(/\.gif/, "_aktiv.gif");
}
</script>

<img src="filnavn.gif" onclick="switchPic(this)">
Avatar billede rane Nybegynder
28. februar 2007 - 09:43 #4
Argh, jeg glemte lige at nævne at der i forvejen også er en onmouseover/onmouseout på billederne.  Også fra dynamicdrive, så img tagget ser således ud:

<img src="gfx/menu/billede.gif" width="191" height="18" alt="" border="0" class="domroll gfx/menu/billede_on.gif" />
Avatar billede rane Nybegynder
28. februar 2007 - 09:57 #5
Billederne der bliver erstattet, indeholder egentlig bare en pil nedaf - så hvis det er nemmere at få vist/skjult et nyt billede til venstre for det oprindelige, så er det også en mulighed?
Avatar billede rane Nybegynder
28. februar 2007 - 13:20 #6
Iøvrigt så virker dit script fint, indtil man vælger et andet menupunkt - så forbliver det forrige valgte hovedpunkt på det aktive billede :(
Avatar billede roenving Novice
02. marts 2007 - 11:15 #7
Så f.eks.

<script type="text/javascript">
var oldPic = null;
function switchPic(pic){
  if(oldPic)
    oldPic.src = oldPic.src.replace(/_aktiv/,"");
  pic.src = (pic.src.indexOf("_aktiv") > 0) ? pic.src.replace(/_aktiv/, "") : pic.src.replace(/\.gif/, "_aktiv.gif");
  oldPic = pic;
}
</script>
Avatar billede rane Nybegynder
02. marts 2007 - 14:52 #8
roenving, kan ikke helt få det til at spille. Se evt. siden her:

http://www.padel.dk/ny/test.asp

(Blev nødt til at omdøbe filerne fra varenavn_aktiv.gif til varenavn_on_aktiv.gif)
Avatar billede roenving Novice
02. marts 2007 - 15:00 #9
Hvad gør den galt ?-)
Avatar billede rane Nybegynder
02. marts 2007 - 15:07 #10
Den bliver nulstillet så snart jeg flytter musen væk fra det menupunkt jeg lige har klikket på. :(  Den skulle gerne forblive aktiv mens man kan mouseover/out på de øvrige og først nulstille når man klikker på en af de øvrige
Avatar billede rane Nybegynder
05. marts 2007 - 08:55 #11
Roenving, har droppet det med onmouseover.  Men dit script mangler lige at kunne nulstille et menupunkt, når man klikker på et andet menupunkt (som så bliver aktiv istedet) - hvis du stadig er derude :)
Avatar billede rane Nybegynder
05. marts 2007 - 08:57 #12
hov ændring...dit sidste script virker fint til det, men det virker ikke hvis man klikker på samme menupunkt for at lukke det igen.
Avatar billede roenving Novice
05. marts 2007 - 15:46 #13
Det forstår jeg ikke, for når jeg prøver virker det upåklageligt (bortset fra de to menupunkter, der har døde links !-)
Avatar billede rane Nybegynder
07. marts 2007 - 08:13 #14
roenving, på http://www.padel.dk/ny/test.asp  virker det fint hvis man klikker på nye punkter hele tiden. Men prøver du at åbne/lukke den samme virker det ikke her i hvert fald (IE6 på WinXP SP2)
Avatar billede roenving Novice
07. marts 2007 - 10:32 #15
Jo, da (og jeg bruger også ie6 på xp sp2 !-)
Avatar billede rane Nybegynder
07. marts 2007 - 10:47 #16
hmm..det er da skummelt ! :(
Avatar billede rane Nybegynder
07. marts 2007 - 11:02 #17
Den fungerer heller ikke i Firefox browseren eller på nogen af de andre maskiner vi har her i firmaet....kan der ikke laves noget i javascript koden mht. browseroptimering måske?
Avatar billede roenving Novice
07. marts 2007 - 11:13 #18
Det virker også i FireFox 1.5.0.10, Opera 9.01 og Mozilla 1.5b (Gecko/20030717) på min maskine !-)
Avatar billede rane Nybegynder
07. marts 2007 - 12:48 #19
Hmm jeg har netop testet det på FireFox 1.5.0.10 med samme resultat som før = det virker ikke.  Og jeg har copy/pastet linket til 5-6 personer siden sidst, og hos samtlige fungerer det ikke.  Har du installeret noget specielt? ;)
Avatar billede roenving Novice
07. marts 2007 - 12:52 #20
Ikke såvidt jeg ved ...

-- og jeg holder computeren forholdsvis ren, da det er en 'halv-offentlig' ting ...

-- den kører vel på en server, når du tester ?-)
Avatar billede roenving Novice
07. marts 2007 - 13:03 #21
Argh ...

-- det var billed-udskiftningen, du hentydede til ...

-- kigger lige på det !-)
Avatar billede roenving Novice
07. marts 2007 - 13:10 #22
Tjah, hvad kan man sige ...

Det er fordi den skiftes både frem og tilbage, så f.eks.

<script type="text/javascript">
var oldPic = null;
function switchPic(pic){
  if(oldPic && oldPic != pic)
    oldPic.src = oldPic.src.replace(/_aktiv/,"");
  pic.src = (pic.src.indexOf("_aktiv") > 0) ? pic.src.replace(/_aktiv/, "") : pic.src.replace(/\.gif/, "_aktiv.gif");
  oldPic = pic;
}
</script>
Avatar billede rane Nybegynder
07. marts 2007 - 14:13 #23
Jaaaa så virker det :)  sorry hvis min formulering var lidt forvirrende ;)  smid lige et svar hehe
Avatar billede roenving Novice
07. marts 2007 - 14:23 #24
Det var fordi, jeg ikke havde set efter, at billedet også omfattede teksten, så den der lille ting ude til venstre havde jeg ikke kigget på ...

-- els velbekomme '-)
Avatar billede roenving Novice
07. marts 2007 - 14:32 #25
-- 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