گرفتن بهترین کدهای جاوا اسکریپت
کد را در میان بادی سایت یا وبلاگ خود کپی کنید
کد شماره ی 17
کدنمایش لینک به صورت منویی
<body onload="window.open("www.har.mihanblog.com")"> </body> <br><!-- START OF Slide Out DHTML --> <br> <br><!-- SUMMARY BRIEFS <br> <br> This DHTML script is an entire webpage by itself. Open it <br> up into a blank webpage and try it out. You can then add <br> your content around it. Basically, you can have 5 different <br> "layers" which switch when the user clicks on the appropriate <br> links. You can adjust the links, colors, and text below. <br> <br> IMPORTANT <br> <br> This example has an image. It is found in the CoffeeCup <br> Software folder on your hard drive. <br>--> <br> <br> <br><SCRIPT LANGUAGE="JavaScript"> <br><!-- <br> <br> <br> <br>n = (document.layers) ? 1:0 <br>ie = (document.all) ? 1:0 <br> <br>function init() { <br> slideoutActive = 0 <br> if (n) { <br> slideout1 = document.slideoutInterface.document.slideoutContent.document.slideoutContent1 <br> slideout2 = document.slideoutInterface.document.slideoutContent.document.slideoutContent2 <br> slideout3 = document.slideoutInterface.document.slideoutContent.document.slideoutContent3 <br> slideout4 = document.slideoutInterface.document.slideoutContent.document.slideoutContent4 <br> slideout5 = document.slideoutInterface.document.slideoutContent.document.slideoutContent5 <br> } <br> <br> if (ie) { <br> slideout1 = slideoutContent1.style <br> slideout2 = slideoutContent2.style <br> slideout3 = slideoutContent3.style <br> slideout4 = slideoutContent4.style <br> slideout5 = slideoutContent5.style <br> } <br> slideoutShown = slideout1 <br> slideoutShown.xpos = 0 <br> slideoutNew = "none" <br> slideoutNew.xpos = -285 <br>} <br> <br> <br>function slideout(which) { <br> if (!slideoutActive && slideoutShown != which) { <br> slideoutActive = 1 <br> slideoutNew = which <br> slideoutNew.xpos = -285 <br> slideoutLeft() <br> } <br>} <br> <br> <br>function slideoutLeft() { <br> if (slideoutShown.xpos > -285) { <br> slideoutShown.xpos -= 15 <br> slideoutShown.left = slideoutShown.xpos <br> setTimeout("slideoutLeft()",30) <br> } <br> else { <br> hide(slideoutShown) <br> show(slideoutNew) <br> setTimeout("slideoutRight()",50) <br> } <br>} <br> <br> <br>function slideoutRight() { <br> if (slideoutNew.xpos < 0) { <br> slideoutNew.xpos += 15 <br> slideoutNew.left = slideoutNew.xpos <br> setTimeout("slideoutRight()",30) <br> } <br> else { <br> slideoutShown = slideoutNew <br> slideoutActive = 0 // stops the sequence <br> } <br>} <br> <br> <br>function show(showobj) { <br> if (n) showobj.visibility = "show" <br> if (ie) showobj.visibility = "visible" <br>} <br>function hide(hideobj) { <br> if (n) hideobj.visibility = "hide" <br> if (ie) hideobj.visibility = "hidden" <br>} <br> <br>//--> <br></SCRIPT> <br><STYLE TYPE="text/css"> <br><!-- <br>A {color:#000000; font-family:"Arial"; font-weight:bold; font-size:10pt; text-decoration:none; line-height:20pt;} <br>STRONG {font-family:"Arial"; font-size:15pt; font-weight:bold; line-height:25pt;} <br>P {font-family:"Arial"; font-size:10pt; line-height:13pt;} <br>TD {font-family:"Arial"; font-size:10pt; line-height:13pt;} <br> <br>#slideoutInterface {position:absolute; left:50; top:50; width:400; height:250; clip:rect(0,400,250,0); background-color:#000000; layer-background-color:#000000; visibility:visible;} <br>#slideoutSidebar1 {position:absolute; left:5; top:5; width:100; height:30; clip:rect(0,100,30,0); background-color:#9797FF; layer-background-color:#9797FF;} <br>#slideoutSidebar2 {position:absolute; left:5; top:40; width:100; height:30; clip:rect(0,100,30,0); background-color:#FFFF00; layer-background-color:#FFFF00;} <br>#slideoutSidebar3 {position:absolute; left:5; top:75; width:100; height:30; clip:rect(0,100,30,0); background-color:#FF80C0; layer-background-color:#FF80C0;} <br>#slideoutSidebar4 {position:absolute; left:5; top:110; width:100; height:30; clip:rect(0,100,30,0); background-color:#00FF80; layer-background-color:#00FF80;} <br>#slideoutSidebar5 {position:absolute; left:5; top:145; width:100; height:30; clip:rect(0,100,30,0); background-color:#FF5353; layer-background-color:#FF5353;} <br> <br>#slideoutContent {position:absolute; left:110; top:5; width:285; height:240; clip:rect(0,285,240,0); background-color:#000000; layer-background-color:#000000;} <br>#slideoutContent1 {position:absolute; left:0; top:0; width:285; height:240; clip:rect(0,285,240,0); background-color:#DEDEDE; layer-background-color:#DEDEDE; visibility:visible;} <br>#slideoutContent2 {position:absolute; left:-285; top:0; width:285; height:240; clip:rect(0,285,240,0); background-color:#DEDEDE; layer-background-color:#DEDEDE; visibility:hidden;} <br>#slideoutContent3 {position:absolute; left:-285; top:0; width:285; height:240; clip:rect(0,285,240,0); background-color:#DEDEDE; layer-background-color:#DEDEDE; visibility:hidden;} <br>#slideoutContent4 {position:absolute; left:-285; top:0; width:285; height:240; clip:rect(0,285,240,0); background-color:#DEDEDE; layer-background-color:#DEDEDE; visibility:hidden;} <br>#slideoutContent5 {position:absolute; left:-285; top:0; width:285; height:240; clip:rect(0,285,240,0); background-color:#DEDEDE; layer-background-color:#DEDEDE; visibility:hidden;} <br> <br>//--> <br></STYLE> <br></HEAD> <br> <br><BODY BGCOLOR="#FFFFFF" TEXT="#000000" onLoad="init()"> <br> <br><DIV ID="slideoutInterface"> <br> <br><DIV ID="slideoutSidebar1"><P ALIGN=CENTER><A HREF="javascript:slideout(slideout1)">Contact Us</A></P></DIV> <br><DIV ID="slideoutSidebar2"><P ALIGN=CENTER><A HREF="javascript:slideout(slideout2)">Help</A></P></DIV> <br><DIV ID="slideoutSidebar3"><P ALIGN=CENTER><A HREF="javascript:slideout(slideout3)">Services</A></P></DIV> <br><DIV ID="slideoutSidebar4"><P ALIGN=CENTER><A HREF="javascript:slideout(slideout4)">Products</A></P></DIV> <br><DIV ID="slideoutSidebar5"><P ALIGN=CENTER><A HREF="javascript:slideout(slideout5)">Order</A></P></DIV> <br> <br><DIV ID="slideoutContent"> <br> <br><DIV ID="slideoutContent1"> <br><P ALIGN="CENTER"><STRONG>Contact Us</STRONG> <br><P> <br><TABLE BORDER=0 WIDTH=275><TD> <br>You can add <A HREF="http://www.webloger.5u.com"><FONT COLOR=BLUE>Links</FONT></A>. <br><P> <br>Or images: <IMG SRC="smile.gif" BORDER=0 HEIGHT=11 WIDTH=11> <br><P> <br>Or just use text to explain what you have or what you are doing. <br></TD></TABLE> <br></P> <br></DIV> <br> <br><DIV ID="slideoutContent2"> <br><P ALIGN="CENTER"><STRONG>Help</STRONG> <br><P> <br><TABLE BORDER=0 WIDTH=275><TD> <br>You can add <A HREF="http://www.webloger.5u.com"><FONT COLOR=BLUE>Links</FONT></A>. <br><P> <br>Or images: <IMG SRC="smile.gif" BORDER=0 HEIGHT=11 WIDTH=11> <br><P> <br>Or just use text to explain what you have or what you are doing. <br> <br></TD></TABLE> <br></P> <br></DIV> <br> <br><DIV ID="slideoutContent3"> <br><P ALIGN="CENTER"><STRONG>Services</STRONG> <br><P> <br><TABLE BORDER=0 WIDTH=275><TD> <br>You can add <A HREF="http://www.webloger.5u.com"><FONT COLOR=BLUE>Links</FONT></A>. <br><P> <br>Or images: <IMG SRC="smile.gif" BORDER=0 HEIGHT=11 WIDTH=11> <br><P> <br>Or just use text to explain what you have or what you are doing. <br> <br></TD></TABLE> <br></P> <br></DIV> <br> <br><DIV ID="slideoutContent4"> <br><P ALIGN="CENTER"><STRONG>Products</STRONG> <br><P> <br><TABLE BORDER=0 WIDTH=275><TD> <br>You can add <A HREF="http://www.webloger.5u.com"><FONT COLOR=BLUE>Links</FONT></A>. <br><P> <br>Or images: <IMG SRC="smile.gif" BORDER=0 HEIGHT=11 WIDTH=11> <br><P> <br>Or just use text to explain what you have or what you are doing. <br> <br></TD></TABLE> <br></P> <br></DIV> <br> <br> <br><DIV ID="slideoutContent5"> <br><P ALIGN="CENTER"><STRONG>Order</STRONG> <br><P> <br><TABLE BORDER=0 WIDTH=275><TD> <br>You can add <A HREF="http://www.webloger.5u.com"><FONT COLOR=BLUE>Links</FONT></A>. <br><P> <br>Or images: <IMG SRC="smile.gif" BORDER=0 HEIGHT=11 WIDTH=11> <br><P> <br>Or just use text to explain what you have or what you are doing. <br> <br></TD></TABLE> <br></P> <br></DIV> <br> <br></DIV> <br> <br></BODY> <br></HTML> <br> <br><!-- END OF Slide Out DHTML -->
