skaczący tekst
<!-- fragment do sekcji HEAD --> <SCRIPT LANGUAGE="JavaScript"> <!-- //--> </SCRIPT><!-- --> <!-- JavaScript Example, freeware --> <!-- --> <!-- Copyright (c) by Wojciech Wysznacki --> <!-- E-mail: woytek@polbox.com --> <!-- WWW : http://www.polbox.com/w/woytek --> <!-- --> <SCRIPT LANGUAGE="JavaScript"> <!-- done = 0; step = 4 function anim(yp,yk) { if(document.layers) document.layers["napis"].top=yp; else document.all["napis"].style.top=yp; if(yp>yk) step = -4 if(yp<60) step = 4 setTimeout('anim('+(yp+step)+','+yk+')', 35); } function start() { if(done) return done = 1; if(navigator.appName=="Netscape") { document.napis.left=innerWidth/2 - 145; anim(60,innerHeight - 60) } else { napis.style.left=11; anim(60,document.body.offsetHeight - 60) } } //--> </SCRIPT> <!-- fragment do sekcji BODY --> <SCRIPT LANGUAGE="JavaScript"> <!-- //--> </SCRIPT><div id='napis' style='position: absolute; top: -50; color: #D23842; font-family: Arial, Helvetica; font-weight:bold; font-size:30px;'>Skaczšcy tekst</div> <SCRIPT LANGUAGE="JavaScript"> <!-- setTimeout('start()',10); //--> </SCRIPT>
Offline
śledzony kursor
<SCRIPT> B=document.all; C=document.layers; T1=new Array("obrazek.gif",38,35,"obrazek.gif",30,31,"obrazek.gif",28,26,"obrazek.gif",22,21,"obrazek.gif",16,16,"obrazek.gif",10,10) nos=parseInt(T1.length/3) rate=50 ie5fix1=0; ie5fix2=0; for (i=0;i<nos;i++){ createContainer("CUR"+i,i*10,i*10,i*3+1,i*3+2,"","<img src='"+T1[i*3]+"' width="+T1[(i*3+1)]+" height="+T1[(i*3+2)]+" border=0>")} function createContainer(N,Xp,Yp,W,H,At,HT,Op,St){ with (document){ write((!B) ? "<layer id='"+N+"' left="+Xp+" top="+Yp+" width="+W+" height="+H : "<div id='"+N+"'"+" style='position:absolute;left:"+Xp+"; top:"+Yp+"; width:"+W+"; height:"+H+"; "); if(St){ if (C) write(" style='"); write(St+";' ") } else write((B)?"'":""); write((At)? At+">" : ">"); write((HT) ? HT : ""); if (!Op) closeContainer(N) } } function closeContainer(){ document.write((B)?"</div>":"</layer>") } function getXpos(N){ return (B) ? parseInt(B[N].style.left) : C[N].left } function getYpos(N){ return (B) ? parseInt(B[N].style.top) : C[N].top } function moveContainer(N,DX,DY){ c=(B) ? B[N].style :C[N];c.left=DX;c.top=DY } function cycle(){ //if (IE5) if (document.all&&window.print){ ie5fix1=document.body.scrollLeft; ie5fix2=document.body.scrollTop; } for (i=0;i<(nos-1);i++){ moveContainer("CUR"+i,getXpos("CUR"+(i+1)),getYpos("CUR"+(i+1))) } } function newPos(e){ moveContainer("CUR"+(nos-1),(B)?event.clientX+ie5fix1:e.pageX+2,(B)?event.clientY+ie5fix2:e.pageY+2 ) } if(document.layers) document.captureEvents(Event.MOUSEMOVE) document.onmousemove=newPos setInterval("cycle()",rate) </SCRIPT>
Offline
śledzony kursor 2
<script language="JavaScript1.2"> <!-- /* Featured on Website Abstraction (http://wsabstract.com) For this and over 400+ free scripts, visit http://wsabstract.com */ var trailLength = 8 // The length of trail (8 by default; put more for longer "tail") var path = "a.gif" // URL of your image // do NOT modify anything beyond this point var isIE = false,isNav = false,range = "all.",style = ".style",i,d = 0 var topPix = ".pixelTop",leftPix = ".pixelLeft",images,storage if (document.layers) { // browser sniffer isNav = true,range = "layers.",style = "",topPix = ".top",leftPix = ".left" } else if (document.all) { isIE = true } function initTrail() { // prepares the script images = new Array() // prepare the image array for (i = 0; i < parseInt(trailLength); i++) { images[i] = new Image() images[i].src = path } storage = new Array() // prepare the storage for the coordinates for (i = 0; i < images.length*3; i++) { storage[i] = 0 } for (i = 0; i < images.length; i++) { // make divs for IE and layers for Navigator (isIE) ? document.write('<div id="obj' + i + '" style="position: absolute; z-Index: 100; height: 0; width: 0"><img src="' + images[i].src + '"></div>') : document.write('<layer name="obj' + i + '" width="0" height="0" z-index="100"><img src="' + images[i].src + '"></layer>') } trail() } function trail() { // trailing function for (i = 0; i < images.length; i++) { // for every div/layer eval("document." + range + "obj" + i + style + topPix + "=" + storage[d]) // the Y-coordinate eval("document." + range + "obj" + i + style + leftPix + "=" + storage[d+1]) // the X-coordinate d = d+2 } for (i = storage.length; i >= 2; i--) { // save the coordinate for the div/layer that's behind storage[i] = storage[i-2] } d = 0 // reset for future use var timer = setTimeout("trail()",10) // call recursively } function processEvent(e) { // catches and processes the mousemove event if (isIE) { // for IE storage[0] = window.event.y+document.body.scrollTop+10 storage[1] = window.event.x+document.body.scrollLeft+10 } else { // for Navigator storage[0] = e.pageY+12 storage[1] = e.pageX+12 } } if (isNav) { document.captureEvents(Event.MOUSEMOVE) // Defines what events to capture for Navigator } if (isIE || isNav) { // initiates the script initTrail() document.onmousemove = processEvent // start capturing } //--> </script>
Offline
podaj swoje imię
<SCRIPT language="JavaScript"> <!-- var caution = false function setCookie(name, value, expires, path, domain, secure) { var curCookie = name + "=" + escape(value) + ((expires) ? "; expires=" + expires.toGMTString() : "") + ((path) ? "; path=" + path : "") + ((domain) ? "; domain=" + domain : "") + ((secure) ? "; secure" : "") if (!caution || (name + "=" + escape(value)).length <= 900000) document.cookie = curCookie else if (confirm("Cookie exceeds 900KB and will be cut!")) document.cookie = curCookie } function getCookie(name) { var prefix = name + "=" var cookieStartIndex = document.cookie.indexOf(prefix) if (cookieStartIndex == -1) return null var cookieEndIndex = document.cookie.indexOf(";", cookieStartIndex + prefix.length) if (cookieEndIndex == -1) cookieEndIndex = document.cookie.length return unescape(document.cookie.substring(cookieStartIndex + prefix.length, cookieEndIndex)) } function deleteCookie(name, path, domain) { if (getCookie(name)) { document.cookie = name + "=" + ((path) ? "; path=" + path : "") + ((domain) ? "; domain=" + domain : "") + "; expires=Thu, 01-Jan-70 00:00:01 GMT" } } function fixDate(date) { var base = new Date(0) var skew = base.getTime() if (skew > 0) date.setTime(date.getTime() - skew) } var now = new Date() fixDate(now) now.setTime(now.getTime() + 31 * 24 * 60 * 60 * 1000) var name = getCookie("name") document.fgcolor = "blue" if (!name) name = prompt("Podaj swoje Imię, następnym razem już będziesz automatycznie witany i nie będzie możliwoci dokonania zmian: ", "") if (name == null || name == "") { alert ("Dlaczego jeste taki nie uprzejmy i się nie przedstawiłe?") } else { setCookie("name", name, now) var today = new Date () var hrs = today.getHours(); document.write ("<font face=Verdana color =white size=3>Czeć "+ name +" !!!"); } // --> </SCRIPT>
Offline
gasnący neon
<SCRIPT language=JavaScript1.2> <!-- ie4 = ((navigator.appVersion.indexOf("MSIE")>0) && (parseInt(navigator.appVersion) >= 4)) var count=0, count2=0, add1 = 3, add2 = 10, timerID function show() { if (ie4) { count +=add1 count2+=add2 delay=30 if(count2>100) count2=100 if(count>100) { count=100 add1 =-10 add2 =-3 delay=350 } if(count<0) count=0 if(count2<0) { count2=0 add1 =3 add2 =10 delay=200 } napis.style.filter="Alpha(Opacity="+count2+",FinishOpacity="+count+",style=4)" timerID=setTimeout("show()",delay); } } //--> </SCRIPT> </HEAD> <BODY bgColor=#000000 text=#ffffff> <CENTER> <DIV id=napis style="COLOR: #0066cc; FILTER: Alpha(Opacity=0,FinishOpacity=0,style=4); FONT-FAMILY: Arial; FONT-SIZE: 40pt; WIDTH: 300px"><font size="6">XKLONOS.PRV.PL</font></DIV></CENTER> <SCRIPT language=JavaScript> <!-- setTimeout('show()',10); //--> </SCRIPT>
Offline
tekst obracający się dookoła kursora
<SCRIPT language=JavaScript> <!-- if (document.all) { yourLogo = "http://webmastering.tnb.pl/news.php Darmowe scrypty "; logoFont = "Verdana"; logoColor = "ffffff"; yourLogo = yourLogo.split(''); L = yourLogo.length; TrigSplit = 360 / L; Sz = new Array() logoWidth = 100; logoHeight = -25; ypos = 0; xpos = 0; step = 0.03; currStep = 0; document.write('<div id="outer" style="position:absolute;top:0px;left:0px"><div style="position:relative">'); for (i = 0; i < L; i++) { document.write('<div id="ie" style="position:absolute;top:0px;left:0px;' +'width:10px;height:10px;font-family:'+logoFont+';font-size:12px;' +'color:'+logoColor+';text-align:center">'+yourLogo[i]+'</div>'); } document.write('</div></div>'); function Mouse() { ypos = event.y; xpos = event.x - 5; } document.onmousemove=Mouse; function animateLogo() { outer.style.pixelTop = document.body.scrollTop; for (i = 0; i < L; i++) { ie[i].style.top = ypos + logoHeight * Math.sin(currStep + i * TrigSplit * Math.PI / 180); ie[i].style.left = xpos + logoWidth * Math.cos(currStep + i * TrigSplit * Math.PI / 180); Sz[i] = ie[i].style.pixelTop - ypos; if (Sz[i] < 5) Sz[i] = 5; ie[i].style.fontSize = Sz[i] / 1.7; } currStep -= step; setTimeout('animateLogo()', 20); } window.onload = animateLogo; } // --> </SCRIPT>
Offline
Boczne menu znikające
<!-- webmastering bogdan1959 http://webmastering.tnb.pl/news.php --> <script language="JavaScript1.2"> /* bogdan1959-2011 Site: http://webmastering.tnb.pl/news.php E-mail: dino213@poczta.fm Version: 6.1 (NS6 zgodność) */ // Ustawienia domyślne. Nie zmieniaj ich. YOffset=40; // bez cudzysłowów!!! staticYOffset=40; // bez cudzysłowów!!! slideSpeed=20 // bez cudzysłowów!!! waitTime=1000; // bez cudzysłowów! ta ustawia czas menu pozostaje poza za po myszy wyłącza ją. hdrFontFamily="Verdana"; hdrFontSize="8"; hdrFontColor="#000080"; hdrBGColor="#AFCCDE"; hdrAlign="right"; hdrVAlign="center"; hdrHeight="40"; linkFontFamily="Verdana"; linkFontSize="8"; linkBGColor="#000077"; linkOverBGColor="#FFF7E5"; linkTarget="_top"; linkAlign="left"; menuBGColor="#000080"; menuIsStatic="yes"; menuWidth=110; // Musi być wielokrotnością 10! bez cudzysłowów! barBGColor="#AFCCDE"; barFontFamily="Verdana"; barFontSize="8"; barFontColor="#000080"; barVAlign="top"; barWidth=30; // bez cudzysłowów!!! NS6 = (document.getElementById&&!document.all) IE = (document.all) NS = (navigator.appName=="Netscape" && navigator.appVersion.charAt(0)=="4") moving=setTimeout('null',1) function moveOut() { if ((NS6 && parseInt(ssm.left)<0)||(IE && ssm.style.pixelLeft<0)||(NS && document.ssm.left<0)) { clearTimeout(moving);moving = setTimeout('moveOut()', slideSpeed) if (NS6) {theleft+=10;ssm.left = theleft;} if (IE) {ssm.style.pixelLeft += 10;} if (NS) {document.ssm.left += 10;document.ssm.clip.left-=10}} else {clearTimeout(moving);moving=setTimeout('null',1)}}; function moveBack() { clearTimeout(moving);moving = setTimeout('moveBack1()', waitTime)} function moveBack1() { if ((NS6 && parseInt(ssm.left)>(-menuWidth))||(IE && ssm.style.pixelLeft>(-menuWidth))||(NS && document.ssm.left>(-menuWidth))) { clearTimeout(moving);moving = setTimeout('moveBack1()', slideSpeed); if (NS6) {theleft-=10;ssm.left = theleft;} if (IE) {ssm.style.pixelLeft -= 10;} if (NS) {document.ssm.left -= 10;document.ssm.clip.left+=10}} else {clearTimeout(moving);moving=setTimeout('null',1)}}; lastY = 0; function makeStatic() { if (NS6) {winY = window.pageYOffset;} if (IE) {winY = document.body.scrollTop;var NM=document.all('ssm').style} if (NS) {winY = window.pageYOffset;var NM=document.ssm} if (NS6||IE||NS) { if (winY!=lastY&&winY>YOffset-staticYOffset) { smooth = .3 * (winY - lastY - YOffset + staticYOffset);} else if (YOffset-staticYOffset+lastY>YOffset-staticYOffset) { smooth = .3 * (winY - lastY);} else {smooth=0} if(smooth > 0) smooth = Math.ceil(smooth); else smooth = Math.floor(smooth); if (NS6) {ssm.top=parseInt(ssm.top)+smooth;} if (IE) NM.pixelTop+=smooth; if (NS) NM.top+=smooth; lastY = lastY+smooth; setTimeout('makeStatic()', 1)}} function initSlide() { if (NS6){ ssm=document.getElementById("ssm").style ssm.visibility="visible"; ssm.left = -menuWidth;} else if (IE) { document.all("ssm").style.visibility = "visible" document.all("ssm").style.pixelLeft = -menuWidth;} else if (NS) { document.layers["ssm"].clip.left = menuWidth; document.layers["ssm"].left = -menuWidth; document.layers["ssm"].visibility = "show"} if (menuIsStatic=="yes") makeStatic();} function reloadPage() {if(NS)location.reload()} function startMenu(menuHeader, barText) { if (IE||NS6) {document.write('<DIV ID="ssm" style="visibility:hidden;Position : Absolute ;Left : 0 ;Top : '+YOffset+' ;Z-Index : 20;width:1px" onmouseover="moveOut()" onmouseout="moveBack()">')} if (NS) {document.write('<LAYER visibility="hide" top="'+YOffset+'" name="ssm" bgcolor="'+menuBGColor+'" left="0" onmouseover="moveOut()" onmouseout="moveBack()">')} if (NS6){document.write('<table border="0" cellpadding="0" cellspacing="0" width="'+(menuWidth+barWidth+2)+'" bgcolor="'+menuBGColor+'"><TR><TD>')} tempBar="" for (i=0;i<barText.length;i++) { tempBar+=barText.substring(i, i+1)+"<BR>"} document.write('<table border="0" cellpadding="0" cellspacing="1" width="'+(menuWidth+barWidth+2)+'" bgcolor="'+menuBGColor+'"><tr><td bgcolor="'+hdrBGColor+'" WIDTH="'+(menuWidth-1)+'" HEIGHT="'+hdrHeight+'" ALIGN="'+hdrAlign+'" VALIGN="'+hdrVAlign+'"> <font face="'+hdrFontFamily+'" Size="'+hdrFontSize+'" COLOR="'+hdrFontColor+'"><b>'+menuHeader+'</b></font></td><td align="center" rowspan="100" width="'+barWidth+'" bgcolor="'+barBGColor+'" valign="'+barVAlign+'"><p align="center"><font face="'+barFontFamily+'" Size="'+barFontSize+'" COLOR="'+barFontColor+'"><B>'+tempBar+'</B></font></p></TD></tr>') theleft=-menuWidth} function addItem(text, link, target) { if (!target) {target=linkTarget} document.write('<TR><TD BGCOLOR="'+linkBGColor+'" onmouseover="bgColor=\''+linkOverBGColor+'\'" onmouseout="bgColor=\''+linkBGColor+'\'" WIDTH="'+(menuWidth-1)+'"><ILAYER><LAYER onmouseover="bgColor=\''+linkOverBGColor+'\'" onmouseout="bgColor=\''+linkBGColor+'\'" WIDTH="100%" ALIGN="'+linkAlign+'"><DIV ALIGN="'+linkAlign+'"><FONT face="'+linkFontFamily+'" Size="'+linkFontSize+'"> <A HREF="'+link+'" target="'+target+'" CLASS="ssmItems">'+text+'</DIV></LAYER></ILAYER></TD></TR>')} function addHdr(text) { document.write('<tr><td bgcolor="'+hdrBGColor+'" HEIGHT="'+hdrHeight+'" ALIGN="'+hdrAlign+'" VALIGN="'+hdrVAlign+'" WIDTH="'+(menuWidth-1)+'"> <font face="'+hdrFontFamily+'" Size="'+hdrFontSize+'" COLOR="'+hdrFontColor+'"><b>'+text+'</b></font></td></tr>')} function endMenu() { document.write('<tr><td bgcolor="'+hdrBGColor+'"><font size="0" face="Arial"> </font></td></TR></table>') if (NS6){document.write('</TD></TR></TABLE>')} if (IE||NS6) {document.write('</DIV>')} if (NS) {document.write('</LAYER>')} if (NS6||IE||NS) setTimeout('initSlide();', 500)} window.onresize=reloadPage /* Konfiguracja style menu poniżej UWAGA: Aby zmienić kolor linku, przejść do tagów STYLE i edytować ssmItems kolorów */ YOffset=20; // bez cudzysłowów! staticYOffset=20; // bez cudzysłowów! slideSpeed=20 // bez cudzysłowów! waitTime=500; // bez cudzysłowów! ta ustawia czas menu pozostaje poza za po myszy wyłącza ją. menuBGColor="#330000"; menuIsStatic="yes"; menuWidth=100; // Musi być wielokrotnością 10! bez cudzysłowów! hdrFontFamily="verdana"; hdrFontSize="2"; hdrFontColor="#002200"; hdrBGColor="#FF9900"; hdrAlign="left"; hdrVAlign="center"; hdrHeight="20"; linkFontFamily="Verdana"; linkFontSize="1"; linkBGColor="white"; linkOverBGColor="#880000"; linkTarget="_top"; linkAlign="Left"; barBGColor="#777777"; barFontFamily="Verdana"; barFontSize="4"; barFontColor="white"; barVAlign="center"; barWidth=20; // bez cudzysłowów! startMenu("Menu", "Grafika bogdan1959") addItem("Główna", "http://webmastering.tnb.pl/news.php", ""); addItem("nazwa 1", "http://webmastering.tnb.pl/news.php", ""); addItem("nazwa 2", "http://webmastering.tnb.pl/news.php", ""); addItem("nazwa 3", "http://webmastering.tnb.pl/news.php", ""); addItem("nazwa 4", "http://webmastering.tnb.pl/news.php", ""); addItem("nazwa 5", "http://webmastering.tnb.pl/news.php", ""); addItem("nazwa 6", "http://webmastering.tnb.pl/news.php", ""); addItem("nazwa 7", "http://webmastering.tnb.pl/news.php", ""); addItem("nazwa 8", "http://webmastering.tnb.pl/news.php", ""); addItem("nazwa 9", "http://webmastering.tnb.pl/news.php", ""); addItem("nazwa 10", "http://webmastering.tnb.pl/news.php", ""); addItem("nazwa 11", "http://webmastering.tnb.pl/news.php", ""); addItem("nazwa 12", "http://webmastering.tnb.pl/news.php", ""); addItem("nazwa 13", "http://webmastering.tnb.pl/news.php", ""); addItem("nazwa 14", "http://webmastering.tnb.pl/news.php", ""); addItem("nazwa 15", "http://webmastering.tnb.pl/news.php", ""); addItem("nazwa 16", "http://webmastering.tnb.pl/news.php", ""); addItem("nazwa 17", "http://webmastering.tnb.pl/news.php", ""); addItem("nazwa 18", "http://webmastering.tnb.pl/news.php", ""); addItem("nazwa 19", "http://webmastering.tnb.pl/news.php", ""); endMenu() </script>
Offline
SHOW TIME
Najbardziej zwariowany kod jaki tylko znam
Po zastosowaniu go pojawi Ci się na stronie "SHOW TIME!!!-kliknij" . Gdy go klikniesz kod "zbierze" obrazki jakie się znajdą na stronie, które z kolei zaczną wariować i latać. Gdy ponownie klikniesz napis, obrazki przyśpieszą i tak w kółko....
<!-- präsentiert von kostenlose-javascripts.de --><br /> <p><a href="javascript:R=0; x1=.1; y1=.05; x2=.25; y2=.24; x3=1.6; y3=.24; x4=300; y4=200; x5=300; y5=200; DI=document.getElementsByTagName('img'); DIL=DI.length; function A(){for(i=0; i-DIL; i++){DIS=DI[ i ].style; DIS.position='absolute'; DIS.left=(Math.sin(R*x1+i*x2+x3)*x4+x5)+'px'; DIS.top=(Math.cos(R*y1+i*y2+y3)*y4+y5)+'px'}R++}setInterval('A()',5); void(0);">SHOW TIME!-Kliknij</a></p><br /><br /> <!-- BITTE BEACHTEN: Der folgende Link darf nicht entfernt oder geändert werden --><br /> <div id="kostenlosejavascripts" align="center"><a href="http://webmastering.tnb.pl/news.php/" title="webmastering" target="_blank">webmastering</a></div><br /><br /> <!-- präsentiert von kostenlose-javascripts.de --><br />
Offline
Menu poziome
<!-- html, body { text-align: center; } --> <div style="text-align: center;"> </div> <!-- center--> <br /> <style type="text/css" media="screen"> <!-- /* Menu na naglowku http://designsg.tk/ */ body { font-family: Verdana, sans-serif; font-size: 14px; overflow: auto; padding: 10px; margin: 0px; } /* */ ul, li { list-style-type: none; padding: 0px; margin: 0px; } /* */ li a { padding-right: 20px;padding-top: 5px; } /* pozycja napisów */ div.menu { position: absolute; z-index: 3; top: 154px; left: 50%; margin-left:-420px; width:905px; } /* */ .menu li { width: 160px; float: left; } /* Obrazek głowny*/ .menu a { border: 0px solid #000000; background-color: #000000; background-image: url(http://img.webme.com/pic/n/naazimcadeneme/nazimcabuton44.jpg); text-decoration: none; text-align: center; font-weight: bold; cursor: pointer; margin: 0px 2px; display: block; height: 23px; color: #ffcc00; } /* obrazek 2 */ .menu a:hover { background-color: #; background-image: url(http://img.webme.com/pic/n/naazimcadeneme/rednaazimca1.jpg); } /* */ #smenu1, #smenu2, #smenu3, #smenu4, #smenu5 { font-size: 12px; display: none; width: 160px; float: left; } /* */ #smenu1 a, #smenu2 a, #smenu3 a, #smenu4 a, #smenu5 a { font-weight: bold; padding-top: 5px; border-top: 0px; cursor: pointer; color: #FFFFFF; } //--> </style> <!-- http://designsg.tk/ --> <script type="text/javascript"> <!-- function montre(id) { with (document) { if (getElementById) getElementById(id).style.display = 'block'; else if (all) all[id].style.display = 'block'; else layers[id].display = 'block'; } } function cache(id) { with (document) { if (getElementById) getElementById(id).style.display = 'none'; else if (all) all[id].style.display = 'none'; else layers[id].display = 'none'; } } //--> </script> <!-- Ende des Scriptes --> <div class="menu"> <li><a href="javascript:void(1);" onmouseover="montre('smenu1');" onmouseout="cache('smenu1');">TEST</a> <ul id="smenu1" onmouseover="montre('smenu1');" onmouseout="cache('smenu1');"> <li><a href="LINK DO STRONY PODSTRONY">Buttons</a></li> <li><a href="LINK DO STRONY PODSTRONY">Buttons</a></li> <li><a href="LINK DO STRONY PODSTRONY">Buttons</a></li> <li><a href="LINK DO STRONY PODSTRONY">Buttons</a></li> </ul> </li> <li><a href="javascript:void(1);" onmouseover="montre('smenu2');" onmouseout="cache('smenu2');">Von meiner HP</a> <ul id="smenu2" onmouseover="montre('smenu2');" onmouseout="cache('smenu2');"> <li><a href="LINK DO STRONY PODSTRONY">Buttons</a></li> <li><a href="LINK DO STRONY PODSTRONY">Buttons</a></li> <li><a href="LINK DO STRONY PODSTRONY">Buttons</a></li> <li><a href="LINK DO STRONY PODSTRONY">Buttons</a></li> </ul> </li> <li><a href="javascript:void(1);" onmouseover="montre('smenu3');" onmouseout="cache('smenu3');">Banner</a> <ul id="smenu3" onmouseover="montre('smenu3');" onmouseout="cache('smenu3');"> <li><a href="LINK DO STRONY PODSTRONY">Buttons</a></li> <li><a href="LINK DO STRONY PODSTRONY">Buttons</a></li> <li><a href="LINK DO STRONY PODSTRONY">Buttons</a></li> <li><a href="LINK DO STRONY PODSTRONY">Buttons</a></li> </ul> </li> <li><a href="javascript:void(1);" onmouseover="montre('smenu4');" onmouseout="cache('smenu4');">HTML</a> <ul id="smenu4" onmouseover="montre('smenu4');" onmouseout="cache('smenu4');"> <li><a href="LINK DO STRONY PODSTRONY">Buttons</a></li> <li><a href="LINK DO STRONY PODSTRONY">Buttons</a></li> <li><a href="LINK DO STRONY PODSTRONY">Buttons</a></li> <li><a href="LINK DO STRONY PODSTRONY">Buttons</a></li> </ul> </li> <li><a href="javascript:void(1);" onmouseover="montre('smenu5');" onmouseout="cache('smenu5');">Serien</a> <ul id="smenu5" onmouseover="montre('smenu5');" onmouseout="cache('smenu5');"> <li><a href="LINK DO STRONY PODSTRONY">Buttons</a></li> <li><a href="LINK DO STRONY PODSTRONY">Buttons</a></li> <li><a href="LINK DO STRONY PODSTRONY">Buttons</a></li> <li><a href="LINK DO STRONY PODSTRONY">Buttons</a></li> </ul> </li> </div> <br /> <style type="text/css"> <!--</style>
Offline
poziome menu ze zmieniającym się kolorem po lewej stronie
<style type="text/css"> <!-- div#menu { float: left; margin-right: 2px; } div#menu a { display: inline-block; text-decoration: none; color: #000000; padding: 1px; border-left: 6px solid #CCCCCC; margin-right: 10px; } div#menu a:hover { color: #FF0000; border-left: 6px solid #FF0000; } --> </style> <div id="menu"> <a href=""> Menu I</a> <a href=""> Menu II</a> <a href=""> Menu III</a> <a href=""> Menu IV</a> <a href=""> Menu V</a> </div>
Offline
Menu pionowe
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>Menu rozwijane pionowe - demo</title> <style type="text/css"> * {margin: 0; padding: 0;} #menu li {list-style: none;} #menu, #menu ul {width: 160px;} #menu ul {visibility: hidden; position: absolute; top: 0; left: 100%; padding-left: 1px;} #menu li {padding-bottom: 1px; line-height: 0; position: relative;} #menu li:hover ul {visibility: visible;} #menu a, #menu li:hover li a {display: block; font: 12px/30px verdana, sans-serif; text-decoration: none; padding: 0 10px; width: 140px; color: #fff; background-color: #666;} #menu li:hover a, #menu li:hover li:hover a {background-color: #333095;} </style> </head> <body> <ul id="menu"> <li><a href="#">Link 1</a> <ul> <li><a href="#">Link 1.1</a></li> <li><a href="#">Link 1.2</a></li> <li><a href="#">Link 1.3</a></li> </ul> </li> <li><a href="#">Link 2</a> <ul> <li><a href="#">Link 2.1</a></li> <li><a href="#">Link 2.2</a></li> <li><a href="#">Link 2.3</a></li> </ul> </li> <li><a href="#">Link 3</a> <ul> <li><a href="#">Link 3.1</a></li> <li><a href="#">Link 3.2</a></li> <li><a href="#">Link 3.3</a></li> </ul> </li> </ul> </body> </html>
Offline
Menu poziome z pionowym submenu
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>Menu rozwijane poziome z pionowym submenu - demo</title> <style type="text/css"> * {margin: 0; padding: 0;} #menu li {list-style: none;} #menu {height: 30px;} #menu ul {visibility: hidden; position: absolute; top: 100%; left: 0;} #menu li {float: left; padding-right: 1px; position: relative;} #menu li li {float: none; padding-top: 1px; width: 160px;} #menu li:hover ul {visibility: visible;} #menu a, #menu li:hover li a {display: block; font: 12px/30px verdana, sans-serif; text-decoration: none; padding: 0 10px; color: #fff; background-color: #666;} #menu li li a {width: 140px;} #menu li:hover a, #menu li:hover li:hover a {background-color: #333095;} </style> </head> <body> <ul id="menu"> <li><a href="#">Link 1</a> <ul> <li><a href="#">Link 1.1</a></li> <li><a href="#">Link 1.2</a></li> <li><a href="#">Link 1.3</a></li> </ul> </li> <li><a href="#">Link 2</a> <ul> <li><a href="#">Link 2.1</a></li> <li><a href="#">Link 2.2</a></li> <li><a href="#">Link 2.3</a></li> </ul> </li> <li><a href="#">Link 3</a> <ul> <li><a href="#">Link 3.1</a></li> <li><a href="#">Link 3.2</a></li> <li><a href="#">Link 3.3</a></li> </ul> </li> </ul> </body> </html>
Offline
Menu poziome z poziomym submenu
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>Menu rozwijane poziome z poziomym submenu - demo</title> <style type="text/css"> * {margin: 0; padding: 0;} #menu li {list-style: none;} #menu {height: 30px; position: relative;} #menu ul {visibility: hidden; padding-top: 1px; width: 100%; position: absolute; top: 100%; left: 0;} #menu li {float: left; padding-right: 1px;} #menu li:hover ul {visibility: visible;} #menu a, #menu li:hover li a {display: block; font: 12px/30px verdana, sans-serif; text-decoration: none; padding: 0 10px; color: #fff; background-color: #666;} #menu li:hover a, #menu li:hover li:hover a {background-color: #333095;} </style> </head> <body> <ul id="menu"> <li><a href="#">Link 1</a> <ul> <li><a href="#">Link 1.1</a></li> <li><a href="#">Link 1.2</a></li> <li><a href="#">Link 1.3</a></li> </ul> </li> <li><a href="#">Link 2</a> <ul> <li><a href="#">Link 2.1</a></li> <li><a href="#">Link 2.2</a></li> <li><a href="#">Link 2.3</a></li> </ul> </li> <li><a href="#">Link 3</a> <ul> <li><a href="#">Link 3.1</a></li> <li><a href="#">Link 3.2</a></li> <li><a href="#">Link 3.3</a></li> </ul> </li> </ul> </body> </html>
Offline