Avatar billede sorenmt Nybegynder
21. september 2000 - 17:16 Der er 10 kommentarer og
1 løsning

Åbn nyt vindue når man trykker på hotspot i et billed

På min hjemmeside har jeg et billed, hvor der er nogle steder, som man kan trykke, for at læse en lille tekst. Den lille tekst, kommer frem i et nyt vindue. Det script, har jeg lavet ved hjælp af en guide på http://www.echoecho.com/dk/toolpopupgenerator.htm

Det virker også fint, så længe det er en stykke tekst, man skal klikke på for at åbne et nyt vindue, men nu er det altså et billed jeg skal bruge det på.

Det er ikke et stort link, til hele billedet, men en masse hotspot, som peger på hver sin fil.
Hvordan får jeg det til at virke på billedet
Avatar billede erikjacobsen Ekspert
21. september 2000 - 17:54 #1
Det kunne være en fordel at stille det i JavaScript kategorien ;-)
Avatar billede el_gnu Nybegynder
21. september 2000 - 18:48 #2
enig med erik, men nu hvor du har stillet spm. her, så kan du ligesågodt få hjælpen her :-)

Det du skal bruge er et image map. Der findes mange gratis utils til formålet. En af de bedre, synes jeg, er den der er indbygget i Stone\'s WebWriter.

Et hurtigt eksempel fra den:

<img src=\"mitBillede.gif\" usemap=\"imageMap1\">
<MAP NAME=\"imageMap1\">
<!-- **Billedkort lavet med Stone\'s WebWriter 3** -->
<AREA SHAPE=\"rect\" COORDS=\"5,5,70,70\" HREF=\"java script:new window();\">
<AREA SHAPE=\"rect\" COORDS=\"81,5,146,70\" HREF=\"java script:new window();\">
<AREA SHAPE=\"circle\" COORDS=\"191,38,32\" HREF=\"java script:new window();\">
<AREA SHAPE=\"DEFAULT\" HREF=\"java script:new window();\">
</MAP>

Ovenstående laver tre klikbare områder to firkanter og en cirkel og du indsætter bare det samme script i HREF attributten som du brugte i tekstlinket.

(-: el Gnu
Avatar billede sorenmt Nybegynder
21. september 2000 - 21:20 #3
Jeg glæmte vist at skrive, at jeg skal kunne bestemme størrelsen og placeringen på de nye vinduer.

Bleklager det med kategorien, jeg må have ramt forkert med musen eller lign....
Avatar billede el_gnu Nybegynder
21. september 2000 - 22:49 #4
<AREA SHAPE=\"rect\" COORDS=\"5,5,70,70\" HREF=\"java script:window.open(\'dinSide.html\',\'ny\',\'width=400,height=250,left=100,top=100,toolbars=0,menubar=0,location=0,status=0,scrollbars=0\');\">

Med ovenstående bestemmer du vist hvad der er at bestemme ;-)
Avatar billede sorenmt Nybegynder
22. september 2000 - 12:41 #5
Hedder funktionen image map i Stones...

Gider du ikke skrive hvad den hedder, og hvor jeg finder den, da jeg selv har stones liggende
Avatar billede sorenmt Nybegynder
22. september 2000 - 14:19 #6
Ok det har jeg prøvet nu, det virker også fint, men når jeg klikker på en af dem, kommer der også fint nok et nyt vindue, men det andet bagved, som jeg klikkede på for at åbne det nye vindue, skifter til en blank side, hvor den kun står: [object]

Hvordan slipper jeg af med det
Avatar billede el_gnu Nybegynder
22. september 2000 - 14:56 #7
Prøv at poste dit imagemap her, så er det lidt nemmere
Avatar billede sorenmt Nybegynder
23. september 2000 - 19:47 #8
http://www.sejs.dk/spejder/gren.htm kan du se hvad der sker når man trykker på billedet. Der er kun lavet et hotspot i \"korps\" som står i stammen på træet
Avatar billede el_gnu Nybegynder
23. september 2000 - 20:59 #9
jeg har fundet fejlen *slår sig selv hårdt i nakken*

window.open() returnerer et objekt som browseren prøver at indlæse som en ny side.

Derfor sætter vi HREF=\"#\" og laver i stedet en onClick der så åbner vinduet:

<AREA SHAPE=\"rect\" COORDS=\"5,5,70,70\" HREF=\"#\" onClick=\"window.open(\'dinSide.html\',\'ny\',\'width=400,height=250,left=100,top=100,toolbars=0,menubar=0,location=0,status=0,scrollbars=0\');\" onFocus=\"this.blur\">

Jeg har også tilføjet en onFocus=\"this.blur\" for at undgå den ramme der kommer om området.

(-: el Gnu
Avatar billede sorenmt Nybegynder
24. september 2000 - 09:37 #10
Gider du ikke lige tilføje et svar, så du kan få dine point :-)
Avatar billede el_gnu Nybegynder
24. september 2000 - 10:56 #11
:-)
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