Seite 1 von 1

onMouseover="showit(0)"

Verfasst: 05.04.2012 09:46
von Lehrling
Hallo,

ich möchte gerne in meinen Header Links mit dieser

Code: Alles auswählen

onMouseover="showit(0)"
-Funktion einbauen. Das soll dann so aussehen, dass sich unter dem Link drei weitere öffnen.
Ich habe nun bei Dynamic Drive etwas gefunden. Kann ich das einfach so in meinen Header einbauen? Mein Style ist Serenity.

LG Lehrling

Hier die Vorlage von Dynamic Drive:

Code: Alles auswählen

/*
Tabs Menu (mouseover)- By Dynamic Drive
For full source code and more DHTML scripts, visit http://www.dynamicdrive.com
This credit MUST stay intact for use
*/

var submenu=new Array()

//Set submenu contents. Expand as needed. For each content, make sure everything exists on ONE LINE. Otherwise, there will be JS errors.

submenu[0]='<div align="right"  style=\"padding-bottom: 0px; padding-left: 5px; padding-right: 0px; padding-top: 12px\"><a href="{U_LOGIN_LOGOUT}"  class="menu">{L_LOGIN_LOGOUT} |</div>'


submenu[1]='<div align="right"  style=\"padding-bottom: 0px; padding-left: 5px; padding-right: 0px; padding-top: 12px\"><a href="{U_PRIVATEMSGS}"  class="menu">{PRIVATE_MESSAGE_INFO} | </a></div>'


submenu[2]='<div align="right"  style=\"padding-bottom: 0px; padding-left: 5px; padding-right: 0px; padding-top: 12px\"><a href="{U_REGISTER}"  class="menu">{L_REGISTER} | </a></div>'


submenu[3]='<div align="right"  style=\"padding-bottom: 0px; padding-left: 5px; padding-right: 0px; padding-top: 12px\"><a href="memberlist.php?mode=&sk=a&sd=a"  class="menu">{L_USERNAME} | </a><a href="memberlist.php?mode=&sk=c&sd=d"  class="menu">{L_JOINED} | </a><a href="memberlist.php?mode=&sk=d&sd=a"  class="menu">{L_POSTS} | </a></div>'


submenu[4]='<div align="right"  style=\"padding-bottom: 0px; padding-left: 5px; padding-right: 0px; padding-top: 12px\"><a href="{U_SEARCH_UNANSWERED}"  class="menu">{L_SEARCH_UNANSWERED} | </a><a href="{U_SEARCH_ACTIVE_TOPICS}"  class="menu">{L_SEARCH_ACTIVE_TOPICS} | </a><a href="{U_SEARCH_NEW}"  class="menu">{L_SEARCH_NEW} | </a><a href="{U_SEARCH_SELF}"  class="menu">{L_SEARCH_SELF} | </a></div>'


submenu[5]='<div align="right"  style=\"padding-bottom: 0px; padding-left: 5px; padding-right: 0px; padding-top: 12px\"><a href="{U_FAQ}"  class="menu">{L_FAQ} | </a></div>'

submenu[6]='<div align="right"  style=\"padding-bottom: 0px; padding-left: 5px; padding-right: 0px; padding-top: 12px\"><a href="{U_SEARCH}"  class="menu">{L_SEARCH} | </a></div>'


//Set delay before submenu disappears after mouse moves out of it (in milliseconds)
var delay_hide=500

/////No need to edit beyond here

var menuobj=document.getElementById? document.getElementById("describe") : document.all? document.all.describe : document.layers? document.dep1.document.dep2 : ""

function showit(which){
clear_delayhide()
thecontent=(which==-1)? "" : submenu[which]
if (document.getElementById||document.all)
menuobj.innerHTML=thecontent
else if (document.layers){
menuobj.document.write(thecontent)
menuobj.document.close()
}
}

function resetit(e){
if (document.all&&!menuobj.contains(e.toElement))
delayhide=setTimeout("showit(-1)",delay_hide)
else if (document.getElementById&&e.currentTarget!= e.relatedTarget&& !contains_ns6(e.currentTarget, e.relatedTarget))
delayhide=setTimeout("showit(-1)",delay_hide)
}

function clear_delayhide(){
if (window.delayhide)
clearTimeout(delayhide)
}

function contains_ns6(a, b) {
while (b.parentNode)
if ((b = b.parentNode) == a)
return true;
return false;
}
Und so sieht dann der Tag für den Link aus:

Code: Alles auswählen

<a href="{U_REGISTER}" onMouseover="showit(2)" class="one">{L_REGISTER}</a>
<!-- IF S_DISPLAY_MEMBERLIST --><a href="{U_MEMBERLIST}" onMouseover="showit(3)" class="one">{L_MEMBERLIST}</a><!-- ENDIF -->