[DW/FW]Imagemaps & Rollovers

[Verwijderd]

Hello!

Ik heb een vraagje. Ik ben een navigatiebalk aan het maken, voorbeeldje op http://www.ffwdclan.nl/webused/gathering/navbar.jpg .

Nu is het in het voorbeeld de bedoeling dat als je over Info heengaat dat er een tabblad naar voren komt zoals in http://www.ffwdclan.nl/webused/gathering/navbar2.jpg .

Nu heb ik al netjes (in DreamWeaver MX) imagemaps gemaakt en dat is allemaal prima, maar hoe krijg je een onmouseover event netjes in een imagamap verwerkt? Of zit ik weer te moeilijk te denken?
Ik wil dus eigenlijk dat ie bij een mouseover zo wordt als in het tweede voorbeeldje en dat ik dan gewoon info kan aanklikken dmv een imagemap.

Alvast bedankt voor jullie reacties!

[Verwijderd]

Kon zo snel niets vinden na natuurlijk even wat doorgespit te hebben hier op het forum wat er op leek.

[BtM909]

Je kan (ook bij image maps) toch werken met rollovers?

Ik zou trouwens de punten uit je link weghalen. Zo doen ze het niet!

Daarnaast kan je deze knop () gebruiken om je laatste post te editten. Scheelt weer een extra post.

[ Voor 42% gewijzigd door BtM909 op 29-07-2003 15:16 ]

[Verwijderd]

Ok. Ik heb dus:
<td width="600" height="81" valign="top">[img]"images/navbar.gif"[/img]</td>

En iets verder

<map name="Map">
<area shape="poly" coords="156,44" href="#">
<area shape="poly" coords="145,12" href="#">
<area shape="poly" coords="162,45,85,45,95,5,145,6" href="main.php?page=info" target="_self" alt="ALTTEKST">

maar als ik daar onmouse events in ga zetten, dan geeft ie foutjes Ben het ff kwijt dus.. Iemand?

[ Voor 108% gewijzigd door Verwijderd op 29-07-2003 15:37 ]

[Verwijderd]

<area shape="poly" coords="162,45,85,45,95,5,145,6" href="main.php?page=info" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('TEST','','images/navbar.jpg',1)" target="_self" alt="ALTTEKST">

Dat heb ik dus staan en dan doet ie het niet, geeft overigens ook geen foutmeldingen

[ Voor 66% gewijzigd door Verwijderd op 29-07-2003 15:52 ]

[Thijsmans]

anders post je 4 posts in je eigen topic



Je moet een javascriptfunctie hebben die én de ronde knop verandert, én de balk. Ik zou zoiets nemen:

code:

function turnButtonOn( buttonName ){
   document.getElementById( buttonName ).src='/img/button_'+buttonName+'_on.gif';
   document.getElementById( 'balk' ).src='/img/balk_'+buttonName+'_on.gif';
}

Zo'n functie maak je ook om ze uit te zetten, vervolgens geef je de buttons een id, die overeenkomt met de URL van het plaatje (zie code), en ik zou de map weggooien. Maar ja, dat is natuurlijk een kwestie van smaak

[ Voor 10% gewijzigd door Thijsmans op 29-07-2003 16:29 . Reden: /edit ]

[Verwijderd]

Ja ok, maar met function MM_swapImgRestore() { //v3.0
var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
}

function MM_preloadImages() { //v3.0
var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
}

function MM_findObj(n, d) { //v4.01
var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
if(!x && d.getElementById) x=d.getElementById(n); return x;
}

function MM_swapImage() { //v3.0
var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
}

zou je ook een heel eind moeten kunnen komen, ik weet alleen niet meer hoe dit te gebruiken binnen een image mapping..

[Verwijderd]

tuurlijk kom je een eind met die muk van MM,
google eens naar "image map" en "rollover",
dan kom je een stuk verder dan met MM_sjmuk{//v.30}var1.j enz

[crisp]

Ik heb persoonlijk slechte ervaringen met events en imagemaps, volgens mij zitten er wat dat betreft nog wel wat bugs in de verschillende browsers, maar ik zou moeten gaan zoeken wat het nou was. Ik gebruikt ze persoonlijk eigenlijk nooit.
Wat ik wel even wou zeggen aan Vennie is dat het netter is om [ code ] tags te gebruiken als je code post