+- MyBB.de Forum (https://www.mybb.de/forum)
+-- Forum: Anpassungen (https://www.mybb.de/forum/forum-47.html)
+--- Forum: Theme-Diskussionen (https://www.mybb.de/forum/forum-84.html)
+--- Thema: Java-Script? - Für DropDown-Menü (/thread-24976.html)
Java-Script? - Für DropDown-Menü - Mutant - 15.02.2012
Hallo User und Userinnen,
habe mal eine Frage bezüglich einem Java-Script.
Wie mache ich das genau? Ich hab ein DropDown-Menü von Suckerfish
und im Quelltext steht das drin:
PHP-Code:
<!-- dieses javascript wird benötigt damit diese dropdownmenü im IE funktioniert -->
<script type="text/javascript"><!--//--><![CDATA[//><!--
sfHover = function() {
var sfEls = document.getElementById("nav").getElementsByTagName("LI");
for (var i=0; i<sfEls.length; i++) {
sfEls[i].onmouseover=function() {
this.className+=" sfhover";
}
sfEls[i].onmouseout=function() {
this.className=this.className.replace(new RegExp(" sfhover\\b"), "");
}
}
}
if (window.attachEvent) window.attachEvent("onload", sfHover);
//--><!]]></script>
Wo muss ich diesen Code einfügen?
Wäre sehr dankbar, wenn mir da jemand weiterhelfen könnte
MfG
RE: Java-Script? - Für DropDown-Menü - StefanT - 15.02.2012
Das sehe ich dem Code auch nicht an...
RE: Java-Script? - Für DropDown-Menü - MrBrechreiz - 15.02.2012
Ganz spontan per GOOGLE hab ich das gefunden.
LINK
Im übrigen, das mit GOOGLE schaffst auch DU ^^.
RE: Java-Script? - Für DropDown-Menü - Mutant - 15.02.2012
Wie, was meinst du StefanT?
@ MrBrechreiz, diese Seite kenn ich selber, nur da steht irgendwie
auch nicht dabei, wo ich den Code einfügen muss..
RE: Java-Script? - Für DropDown-Menü - MrBrechreiz - 15.02.2012
-Die Navi natürlich ins Header Template deines Designs.
-CSS Code ins global.css
-Den Java Code hängst du vor dem schliessenden head tag
Code:
<script type="text/javascript">sfHover = function() {
var sfEls = document.getElementById("nav").getElementsByTagName("LI");
for (var i=0; i<sfEls.length; i++) {
sfEls[i].onmouseover=function() {
this.className+=" sfhover";
}
sfEls[i].onmouseout=function() {
this.className=this.className.replace(new RegExp(" sfhover\\b"), "");
}
}
}
if (window.attachEvent) window.attachEvent("onload", sfHover);
</script>hab ma seinen quelltext ausgelesen.
Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html>
<head>
<title>Suckerfish Dropdowns - One Level Bones</title>
<style type="text/css">
body {
font-family: arial, helvetica, serif;
}
#nav, #nav ul { /* all lists */
padding: 0;
margin: 0;
list-style: none;
line-height: 1;
}
#nav a {
display: block;
width: 10em;
}
#nav li { /* all list items */
float: left;
width: 10em; /* width needed or else Opera goes nuts */
}
#nav li ul { /* second-level lists */
position: absolute;
background: orange;
width: 10em;
left: -999em; /* using left instead of display to hide menus because display: none isn't read by screen readers */
}
#nav li:hover ul, #nav li.sfhover ul { /* lists nested under hovered list items */
left: auto;
}
#content {
clear: left;
color: #ccc;
}
</style>
<script type="text/javascript"><!--//--><![CDATA[//><!--
sfHover = function() {
var sfEls = document.getElementById("nav").getElementsByTagName("LI");
for (var i=0; i<sfEls.length; i++) {
sfEls[i].onmouseover=function() {
this.className+=" sfhover";
}
sfEls[i].onmouseout=function() {
this.className=this.className.replace(new RegExp(" sfhover\\b"), "");
}
}
}
if (window.attachEvent) window.attachEvent("onload", sfHover);
//--><!]]></script>
</head>
<body>
<h1>PERCIFORMES! (1)</h1>
<p>Welcome to the world of Perciformes - perch-like fish including the world famous <strong>Suckerfish</strong></p>
<ul id="nav">
<li><a href="#">Percoidei</a>
<ul>
<li><a href="#">Remoras</a></li>
<li><a href="#">Tilefishes</a></li>
<li><a href="#">Bluefishes</a></li>
<li><a href="#">Tigerfishes</a></li>
</ul>
</li>
<li><a href="#">Anabantoidei</a>
<ul>
<li><a href="#">Climbing perches</a></li>
<li><a href="#">Labyrinthfishes</a></li>
<li><a href="#">Kissing gouramis</a></li>
<li><a href="#">Pike-heads</a></li>
<li><a href="#">Giant gouramis</a></li>
</ul>
</li>
<li><a href="#">Gobioidei</a>
<ul>
<li><a href="#">Burrowing gobies</a></li>
<li><a href="#">Dartfishes</a></li>
<li><a href="#">Eellike gobies</a></li>
<li><a href="#">Gobies</a></li>
<li><a href="#">Loach gobies</a></li>
<li><a href="#">Odontobutidae</a></li>
<li><a href="#">Sandfishes</a></li>
<li><a href="#">Schindleriidae</a></li>
<li><a href="#">Sleepers</a></li>
<li><a href="#">Xenisthmidae</a></li>
</ul>
</li>
</ul>
<div id="content">
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Suspendisse egestas ultricies pede. Phasellus suscipit blandit risus. Praesent nonummy. In erat. Duis nibh pede, accumsan eu, pulvinar et, volutpat vel, elit. Curabitur nec dui sed nunc congue tempus. Nulla ac dui ac libero fringilla nonummy. Maecenas ullamcorper sodales risus. Vivamus pretium dolor. Proin eu turpis. Phasellus ut mauris non nulla mattis luctus. Nunc porttitor dapibus sapien. In malesuada fermentum metus. Nulla egestas, tellus a vestibulum pharetra, nunc purus auctor lacus, ut semper purus ipsum eu velit. Praesent dui. Nulla accumsan turpis at erat.</p>
<p><a href="/articles/suckerfish/dropdowns/">Suckerfish Dropdowns</a> by <a href="/ptg/">Patrick Griffiths</a> and <a href="http://www.danwebb.net">Dan Webb</a>.</p>
</div>
</body>
</html>RE: Java-Script? - Für DropDown-Menü - Falkenauge Mihawk - 15.02.2012
Java != Javascript
Wichtigste Regel.
edit: JS-Code kommt in der Regel immer in den Head-Bereich (im <head>-Tag und vor </head>).
RE: Java-Script? - Für DropDown-Menü - MrBrechreiz - 15.02.2012
(15.02.2012, 17:58)Falkenauge Mihawk schrieb: edit: JS-Code kommt in der Regel immer in den Head-Bereich (im <head>-Tag und vor </head>).
nicht immer ^^
RE: Java-Script? - Für DropDown-Menü - Mutant - 15.02.2012
Erstmal Danke.
Blöde Frage: In welchem Template muss ich den JavaCode einfügen?
Im Template "header" gibt es nichts mit <head></head>
RE: Java-Script? - Für DropDown-Menü - Falkenauge Mihawk - 15.02.2012
(15.02.2012, 18:01)MrBrechreiz schrieb:Darum steht da auch in der Regel.(15.02.2012, 17:58)Falkenauge Mihawk schrieb: edit: JS-Code kommt in der Regel immer in den Head-Bereich (im <head>-Tag und vor </head>).
nicht immer ^^
(15.02.2012, 18:02)Mutant schrieb: Erstmal Danke.Das Template heisst "headerinclude".
Blöde Frage: In welchem Template muss ich den JavaCode einfügen?
Im Template "header" gibt es nichts mit <head></head>
RE: Java-Script? - Für DropDown-Menü - Mutant - 15.02.2012
Im headerinclude template gibt es aber auch keine <head></head> tags? Oo
Sorry, ich kenn mich nicht so aus, deswegen bin ich entweder blöd oder
ich versteh das nur falsch.
