Home News About Contact Guestbook
[Beschreibung]
DHTML- Navigation mit Transparenzeffekt.
[Kompatibilität]
[Code]
<style> .a{z-index:10;position:absolute; height:40;width:150;top:50;left:320;border:#cccccc solid 1px;padding:5;background:#ffeeee;font:11;color:#000000;filter='alpha(opacity=70)';-moz-opacity:0.7} .b{z-index:9;position:absolute;height:40; width:150;top:95;left:320;border:#cccccc solid 1px;padding:5;background:#eeeeff;font:11;color:#000000;filter='alpha(opacity=70)';-moz-opacity:0.7} .c{z-index:8;position:absolute;height:40; width:150;top:140;left:320;border:#cccccc solid 1px;padding:5;background:#eeffff;font:11;color:#000000;filter='alpha(opacity=70)';-moz-opacity:0.7} .d{z-index:7;position:absolute; height:40;width:150;top:185;left:320;border:#cccccc solid 1px;padding:5;background:#ffffee;font:11;color:#000000;filter='alpha(opacity=70)';-moz-opacity:0.7} .e{z-index:6;position:absolute; height:40;width:150;top:230;left:320;border:#cccccc solid 1px;padding:5;background:#ffeeff;font:11;color:#000000;filter='alpha(opacity=70)';-moz-opacity:0.7} </style>
Hinweis: Passen Sie die Style- Angaben dem Design Ihrer Website an...
<a href="#"><div class=a id=1 onmouseover="st1(20,1)" onmouseout="st2(80,1)">Home</div></a> <a href="#"><div class=b id=2 onmouseover="st1(20,2)" onmouseout="st2(80,2)">News</div></a> <a href="#"><div class=c id=3 onmouseover="st1(20,3)" onmouseout="st2(80,3)">About</div></a> <a href="#"><div class=d id=4 onmouseover="st1(20,4)" onmouseout="st2(80,4)">Contact</div></a> <a href="#"><div class=e id=5 onmouseover="st1(20,5)" onmouseout="st2(80,5)">Guestbook</div></a> <script> <!-- /* this script is (c) by oktay oeztueter 2002, * please contact me before u you this script commercial. * it's free for testing purposes and for private use * when you sign my guestbook with your webpage url and email address :-) * this script was modified by N8i (www.nightfire.ch) * it works now also correctly with Mozilla browsers */ //Browser Sniffer var ie4up = (document.all) ? 1 : 0; var mozup = (!document.all && document.getElementById) ? 1 : 0; aus(); function st1(a,id){ i=a; i+=19; document.getElementById(id).style.letterSpacing=i/9; if (ie4up) { document.getElementById(id).style.filter='alpha(opacity='+i+')'; } if (mozup) { b = i/100 document.getElementById(id).style.MozOpacity = b; } if (i<90) { setTimeout('st1('+i+','+id+')',1) } return(i) } function st2(a,id){ i=a; i-=5; document.getElementById(id).style.letterSpacing = i/13 if (ie4up) document.getElementById(id).style.filter='alpha(opacity='+i+')'; if (mozup) b = i/100 document.getElementById(id).style.MozOpacity = b; if (i>50){ setTimeout('st2('+i+','+id+')',1) } } function aus(){ for (z=1;z<=5;z++){ if (ie4up) { document.getElementById(z).style.filter='alpha(opacity=70)'; } if (mozup) { document.getElementById(z).style.MozOpacity = 0.7; } document.getElementById(z).style.letterSpacing=2; } } //--> </script>
Oktay Oeztueter modified by N8i (www.nightfire.ch)
Kopieren Sie bitte den Code, beachten Sie die Copyrightbestimmungen im Quellcode!!