PDA

Archiv verlassen und diese Seite im Standarddesign anzeigen : navigationsleiste


sharke
2005-02-26, 22:39:34
hallo,

ich suche eine navigationsleiste java wäre da nicht schlecht..
und zwar in der art wie hier http://sharke.dyndns.org/cut/neu/index2.htm
sprich so angeordnet und vieleicht das wenn man mit der maus drüber geht das es da nach unten aufklappt... hätte jemand eine idee ?

Kinman
2005-02-27, 09:55:49
schau Dir lieber ein wenig css an. Damit kann man auch sehr viel schönes machen, und es gibt weniger Kompatibilitätsschwierigkeiten. Hier ein Beispiel, allerdings habe ich dazu auch JavaScript benötigt, was auch nicht gerade so toll ist....

http://labx.de.vu

mfg Kinman

sharke
2005-02-27, 09:58:02
:) hilft mir nocht gerade weiter :)

eine frage wie kann ich das javascript ein bischen einrücken in der tabelle so das nicht an der tabellen rand anfängt ?

Kinman
2005-02-27, 10:07:27
ich versteh nicht ganz was Du meinst?
Hier der Code:

html:

<UL>
<LI>
<A CLASS="menutop" HREF="index.php?site=news&PHPSESSID=8005b8d2545a1cf3ca7442e4b86ab479">NEWS</A>
</LI>

<LI>
<A CLASS="menutop" onmouseover="fadein('smenu2');" onmouseout="fadeout('smenu2');" HREF="index.php?site=webdesign&PHPSESSID=8005b8d2545a1cf3ca7442e4b86ab479">WEBDESIGN</A>
<UL ID="smenu2" onmouseover="fadein('smenu2');" onmouseout="fadeout('smenu2');">
<LI><A CLASS="menu" HREF="index.php?site=webdesign&action=projects&PHPSESSID=8005b8d2545a1cf3ca7442e4b86ab479">&nbsp;&nbsp;&nbsp;&nbsp;- Projects</A></LI>
<LI><A CLASS="menu" HREF="index.php?site=webdesign&action=references&PHPSESSID=8005b8d2545a1cf3ca7442e4b86ab479">&nbsp;&nbsp;&nbsp;&nbsp;- References</A></LI>
<LI><A CLASS="menu" HREF="index.php?site=webdesign&action=information&PHPSESSID=8005b8d2545a1cf3ca7442e4b86ab479">&nbsp;&nbsp;&nbsp;&nbsp;- Information</A></LI>
</UL>
</LI>
<LI>
<A CLASS="menutop" onmouseover="fadein('smenu3');" onmouseout="fadeout('smenu3');" HREF="index.php?site=software&PHPSESSID=8005b8d2545a1cf3ca7442e4b86ab479">SOFTWARE</A>
<UL ID="smenu3" onmouseover="fadein('smenu3');" onmouseout="fadeout('smenu3');">
<LI><A CLASS="menu" HREF="?PHPSESSID=8005b8d2545a1cf3ca7442e4b86ab479">&nbsp;&nbsp;&nbsp;&nbsp;- Projects</A></LI>
<LI><A CLASS="menu" HREF="?PHPSESSID=8005b8d2545a1cf3ca7442e4b86ab479">&nbsp;&nbsp;&nbsp;&nbsp;- References</A></LI>
<LI><A CLASS="menu" HREF="?PHPSESSID=8005b8d2545a1cf3ca7442e4b86ab479">&nbsp;&nbsp;&nbsp;&nbsp;- Webscripts</A></LI>
<LI><A CLASS="menu" HREF="?PHPSESSID=8005b8d2545a1cf3ca7442e4b86ab479">&nbsp;&nbsp;&nbsp;&nbsp;- Information</A></LI>
</UL>
</LI>
<LI>
<A CLASS="menutop" onmouseover="fadein('smenu4');" onmouseout="fadeout('smenu4');" HREF="index.php?site=software&PHPSESSID=8005b8d2545a1cf3ca7442e4b86ab479">TEAM</A>
<UL ID="smenu4" onmouseover="fadein('smenu4');" onmouseout="fadeout('smenu4');">
<LI><A CLASS="menu" HREF="index.php?site=software&PHPSESSID=8005b8d2545a1cf3ca7442e4b86ab479">&nbsp;&nbsp;&nbsp;&nbsp;- Sorko Juergen</A></LI>
<LI><A CLASS="menu" HREF="index.php?site=software&PHPSESSID=8005b8d2545a1cf3ca7442e4b86ab479">&nbsp;&nbsp;&nbsp;&nbsp;- Mirnig Thomas</A></LI>
<LI><A CLASS="menu" HREF="index.php?site=software&PHPSESSID=8005b8d2545a1cf3ca7442e4b86ab479">&nbsp;&nbsp;&nbsp;&nbsp;- Kokal Josef</A></LI>
<LI><A CLASS="menu" HREF="index.php?site=software&PHPSESSID=8005b8d2545a1cf3ca7442e4b86ab479">&nbsp;&nbsp;&nbsp;&nbsp;- ...</A></LI>
</UL>
</LI>
<LI>
<A CLASS="menutop" onmouseover="fadein('smenu5');" onmouseout="fadeout('smenu5');" HREF="index.php?site=misc&PHPSESSID=8005b8d2545a1cf3ca7442e4b86ab479">MISC</A>
<UL ID="smenu5" onmouseover="fadein('smenu5');" onmouseout="fadeout('smenu5');">
<LI><A CLASS="menu" HREF="?PHPSESSID=8005b8d2545a1cf3ca7442e4b86ab479">&nbsp;&nbsp;&nbsp;&nbsp;- About LabX</A></LI>
<LI><A CLASS="menu" HREF="?PHPSESSID=8005b8d2545a1cf3ca7442e4b86ab479">&nbsp;&nbsp;&nbsp;&nbsp;- Downloads</A></LI>
<LI><A CLASS="menu" HREF="?PHPSESSID=8005b8d2545a1cf3ca7442e4b86ab479">&nbsp;&nbsp;&nbsp;&nbsp;- Links</A></LI>
</UL>
</LI>
<LI>
<A CLASS="menutop" onmouseover="fadein('smenu6');" onmouseout="fadeout('smenu6');" HREF="index.php?site=memberarea&PHPSESSID=8005b8d2545a1cf3ca7442e4b86ab479">MEMBERAREA</A>
<UL ID="smenu6" onmouseover="fadein('smenu6');" onmouseout="fadeout('smenu6');">
<LI><A CLASS="menu" HREF="?PHPSESSID=8005b8d2545a1cf3ca7442e4b86ab479">&nbsp;&nbsp;&nbsp;&nbsp;- Profile</A></LI>
<LI><A CLASS="menu" HREF="?PHPSESSID=8005b8d2545a1cf3ca7442e4b86ab479">&nbsp;&nbsp;&nbsp;&nbsp;- Admin Options</A></LI>
</UL>
</LI>
<LI>
<A CLASS="menutop" onmouseover="fadein('smenu7');" onmouseout="fadeout('smenu7');" HREF="http://the-assassines.com/labx/forum/">FORUM</A>
</LI>

</UL>


css

DIV.menu {position: absolute; z-index: 5; height:15px; left: 10px; top: 106px;}
DIV.menu li {float: left; width: 110px;}
DIV.menu a {margin: 0px; height: 15px; font-size: 12px; display: block; text-align: left; border: 0; text-decoration: none; color: #FFFFFF; background: #A0AAB5}
DIV.menu a:hover {border: 0; font-size: 12px;}


#smenu1, #smenu2, #smenu3,
#smenu4, #smenu5, #smenu6 , #smenu7 {display: none; float: left; width: 110px; font-size: 12px;}
#smenu1 a, #smenu2 a, #smenu3 a,
#smenu4 a, #smenu5 a, #smenu6 a, #smenu7 a {font-weight: normal; border: 0;}

ul, li {list-style-type: none; margin: 0; padding: 0;}


js

function fadein(id)
{
if (document.getElementById)
{
document.getElementById(id).style.display="block";
}
else if (document.all)
{
document.all[id].style.display="block";
}
else if (document.layers)
{
document.layers[id].display="block";
}
}

function fadeout(id)
{
if (document.getElementById)
{
document.getElementById(id).style.display="none";
}
else if (document.all)
{
document.all[id].style.display="none";
}
else if (document.layers)
{
document.layers[id].display="none";
}
}


Ich weiß nciht wieviel Du davon verstehst. Aber wenn Du wo nicht weiterkommst: http://de.selfhtml.org

mfg Kinman