Avatar billede upsmann Nybegynder
23. maj 2005 - 08:35 Der er 19 kommentarer og
2 løsninger

2 funktioner med onclick

Hej, vil høre om der er nogle der kan hjælpe!

Jeg skal bruge et <script> som kan afhjælpe mig med følgende:

Når jeg kliker på et billede skal den skifte billede, og når jeg klikker igen skal den skifte igen.
Ideen er at jeg skal kunne lave ala winXP <vis/skjul> i et "dokumentvindue".

Jeg har lavet nedenstående som virker til at jeg kan vis/skjule
- men mangler at kunne få billede til at skifte også, således at når man klikker den "ned" = billede 1 og "op" = billede 2
Eller hvordan det nu kan laves!

<script>
(undladt at smide det her da der stå _meget_ men hvis skal bruges sig til så smider jeg)
</script>

<img border="0" name="klik" onClick="expandit(this);" src="billede1.jpg" width="80" height="25">

<div style="display: open;">
!det der skal vises her når der klikkes!
</div>
Avatar billede busschou Praktikant
23. maj 2005 - 09:36 #1
Hvis du vil have det kommer frem ved "ned" og forsvinder ved "op" så skal du benytte "onmousedown" og "onmouseup"
http://www.w3schools.com/html/html_eventattributes.asp
Avatar billede busschou Praktikant
23. maj 2005 - 09:39 #2
jeg ved så ikke om det går godt hvis du samtidig har en onclick...men måske sådan her
--
<img border="0" name="klik" onmousedown="document.getElementById('skjultdiv').style.display='block'; this.src='billede2.jpg';" onmouseup="this.src=billede1.jpg;" src="billede1.jpg" width="80" height="25">

<div id="skjultdiv" style="display: none;">
!det der skal vises her når der klikkes!
</div>
Avatar billede busschou Praktikant
23. maj 2005 - 09:39 #3
og hvis den skal skjules igen på mouseup så
--
<img border="0" name="klik" onmousedown="document.getElementById('skjultdiv').style.display='block'; this.src='billede2.jpg';" onmouseup="document.getElementById('skjultdiv').style.display='none'; this.src=billede1.jpg;" src="billede1.jpg" width="80" height="25">

<div id="skjultdiv" style="display: none;">
!det der skal vises her når der klikkes!
</div>
Avatar billede jakoba Nybegynder
23. maj 2005 - 11:01 #4
Du har brug for en variabel til at huske hvilket billede er aktivt.
fx:
<img border="0" name="klik" onClick="if(this.isOff){unexpand(this);this.src='billede2.jpg';this.isOff=false}else{expandit(this);this.src='billede1.jpg';this.isOff=true}" src="billede1.jpg" width="80" height="25">

ovenfor oprettes of bruges en variabel isOff i img objetet.
Avatar billede jakoba Nybegynder
23. maj 2005 - 11:09 #5
men som du skriver det sørger 'expandit' funktionen for både at åbne og lukke din div, så den har nok en huske variabel selv

så måske det er nemmere at ændre lidt i expandit finktionen

function expandit( imgObjekt ) {
    if (  fest on der skal åbnes  ) {
        imgObjekt.src="billede1.jpg";
        // kode der åbner
    } else {
        imgObjekt.src="billede2.jpg";
        // kode der lukker
    }
} //endmethod
Avatar billede upsmann Nybegynder
23. maj 2005 - 12:41 #6
Jeg har nu prøvet lidt af det i skriver der, og kan ikke helt få det til at virke.

http://www.fixmix.dk/design/Default.html <- på denne side kan i se mit eks. på hvad det er jeg er ved at lave og prøver at få til at virke!

Det er de pile op/ned - som gerne skulle skifte når jeg klikker på dem!..

men sikkert mig der ikke helt forstå hvordan jeg skal bruge de script i har smidt! :)
Avatar billede upsmann Nybegynder
23. maj 2005 - 12:52 #7
<script language="JavaScript" type="text/javascript">
        if(document.getElementById&&!document.all){ns6=1;}else{ns6=0;}
        var agtbrw=navigator.userAgent.toLowerCase();
        var operaaa=(agtbrw.indexOf('opera')!=-1);
        var head="display:''";
        var folder='';           
       
        function expandit(curobj){
            if(document.getElementById(curobj)){
              folder=document.getElementById(curobj).style;
            } else {
              if(ns6==1||operaaa==true){
                  folder=curobj.nextSibling.nextSibling.style;
              } else {
                  folder=document.all[curobj.sourceIndex+1].style;
              }
            }
            if (folder.display=="none") {
              folder.display="";
            } else {
              folder.display="none";
            }
        }
   

</script>
Avatar billede jakoba Nybegynder
23. maj 2005 - 13:18 #8
if (folder.display=="none") {
              curobj.src="billede1.jpg";        // tilføjet linie
              folder.display="";
            } else {
              curobj.src="billede2.jpg";        // tilføjet linie
              folder.display="none";
            }

PS: du ved vel at onclick eventhandlereen kun virker i <img kommandoer hvis brugeren benytter Internet Explorer. De HTML-standard browsere Netscape, Firefox, Opera, Konquere ignorerer onclick in <img kommandoer.
Avatar billede upsmann Nybegynder
23. maj 2005 - 13:28 #9
*avs* nej! - oki, er der så en anden måde jeg kan løse det på? - på <tr <td eller noget?

Men det du har smidt nu virker rigtigt nok fint i IE.. :)
Avatar billede roenving Novice
23. maj 2005 - 15:03 #10
Måske sådan noget, som er vist her: http://www.eksperten.dk/spm/414464 !-)
Avatar billede upsmann Nybegynder
23. maj 2005 - 15:10 #11
oki, den ville kunne virke i alle typer browsere eller? :)
Avatar billede roenving Novice
23. maj 2005 - 15:41 #12
Den burde ikke have problemer i nogen nyere browsere, den virker ikke i Netscape 4 (og måske IE4 !-) og tidligere browsere, men umiddelbart skulle den være fuldt kompatibel med samtlige nyere browsere (med forbehold for de simple til håndholdte devices !-)
Avatar billede roenving Novice
23. maj 2005 - 15:42 #13
-- i øvrigt har jeg den også i en mere blæret version her: http://www.eksperten.dk/spm/485556#rid4489881
Avatar billede upsmann Nybegynder
24. september 2005 - 15:46 #14
hov mangler et svar så jeg kan lukke spm :)
Avatar billede roenving Novice
24. september 2005 - 21:40 #15
Hvem ?-)
Avatar billede busschou Praktikant
24. september 2005 - 23:13 #16
Ved ikke om jeg har gjort mig fortjent til noget, men her er et svar så kan du jo vurdere det :o)
Avatar billede upsmann Nybegynder
25. september 2005 - 12:19 #17
hehe ja oki, ik meget at smide om sig med 30 points!
Men endligt så brude i jo have 10 hver, da i alle har bidraget med at få det til at virke!

Så ja.. det må blive sådan..

roenving: smid svar
jakoba: smid svar
Busschou: 10 på vej til dig når de har smidt svar.

( hehe tænk at der skal så meget til for 30 points :/ - men skal jo gå retfærdigt til :P )
Avatar billede roenving Novice
25. september 2005 - 22:08 #18
Velbekomme '-)
Avatar billede jakoba Nybegynder
26. september 2005 - 11:34 #19
Jeg er storsidet og afstår mine 10 :-))
Avatar billede upsmann Nybegynder
26. september 2005 - 11:51 #20
hehe, så er der 15 til hver af jer :P

Men anyway, tak for hlp. til alle parter :)
Avatar billede roenving Novice
26. september 2005 - 14:02 #21
-- og jeg takker 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
Kurser inden for grundlæggende programmering

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