« »

Hiệu ứng tạo một trình đơn ẩn trong logo của website. Logo này tự động trượt theo các thanh trạng và mỗi khi người dùng rê con trỏ chuột đến logo thì trình đơn sẽ được hiển thị, và khi rê con trỏ chuột ra khỏi menu sau một khoảng thời gian thì menu sẽ chuyển thành logo như cũ. Một hiệu ứng rất tuyệt dùng để tiết kiệm không gian trên tran web.

Nhãn: Menu ẩn trong logo

Báo cho chúng tôi lỗi JavaScript này

Demo
Phóng to
Tải lại
Cửa sổ mới

Mã nguồn
Files
JavaScript
HTML
In

brand.gif

Copy All x2

<SCRIPT language=javaScript>
function setVariables(){
if (navigator.appName == "Netscape") {
v=".top=";h=".left=";dS="document.";sD="";
y="window.pageYOffset";x="window.pageXOffset";iW="window.innerWidth";iH="window.innerHeight"

}

else {h=".pixelLeft=";v=".pixelTop=";dS="";sD=".style";
y="document.body.scrollTop";x="document.body.scrollLeft";iW="document.body.clientWidth";iH="document.body.clientHeight"

}
xyz=500


object="logo";
checkLocationA()
}
movex=0,movey=0,xdiff=0,ydiff=0,ystart=0,xstart=0
function checkLocation(){
innerX=eval(iW)-135
innerY=eval(iH)-120
if (document.layers){innerY-=10;innerX-=10}
yy=eval(y);
xx=eval(x);
ydiff=ystart-yy;
xdiff=xstart-xx;
if ((ydiff<(-1))||(ydiff>(1))) movey=Math.round(ydiff/10),ystart-=movey
if ((xdiff<(-1))||(xdiff>(1))) movex=Math.round(xdiff/10),xstart-=movex
eval(dS+object+sD+v+(ystart+innerY));
eval(dS+object+sD+h+(xstart+innerX));
setTimeout("checkLocation()",10)}

function checkLocationA(){ystart=eval(y);xstart=eval(x);}

function switchLogo(abc){
if (abc=="menu"){                     //to stop the switch logo function
eval(dS+object+sD+v+0);               // just
eval(dS+object+sD+h+(-200));           // slash out these lines
object=abc}                              //at the
else xyz=setTimeout("delayLogo()",2000)   // beginning
}

function delayLogo(){
eval(dS+object+sD+v+0);          //
eval(dS+object+sD+h+(-200));      //and these three too
object='logo'                     //
}

</SCRIPT>
	<!--
    	This script downloaded from www.JavaScriptBank.com
    	Come to view and download over 2000+ free javascript at www.JavaScriptBank.com
	-->

Copy All x2

<BODY onload=setVariables();checkLocation()>
<DIV id=logo style="LEFT: 0px; POSITION: absolute; TOP: -200px; Z-INDEX: 2">
<TABLE border=0 cellPadding=0 cellSpacing=10 width=100>
  <TBODY>
  <TR>
    <TD bgColor=#eeeeee>
      <CENTER><A href="javascript:void(0)" onmouseover="switchLogo('menu')" 
      ;><BR><BR>
      <IMG border=0 
  src="brand.gif" width="99" height="24"></A></CENTER></TD></TR></TBODY></TABLE></DIV>
<DIV id=menu style="LEFT: 0px; POSITION: absolute; TOP: -200px; Z-INDEX: 2">
<TABLE border=0 cellPadding=0 cellSpacing=10 width=100>
  <TBODY>
  <TR>

    <TD bgColor=#eeeeee>
      <CENTER><A href="javascript:void(0)" onmouseout="switchLogo('logo')" 
      onmouseover=clearTimeout(xyz) ;>Menu One</A></CENTER></TD></TR>
  <TR>
    <TD bgColor=#eeeeee>
      <CENTER><A href="javascript:void(0)" onmouseout="switchLogo('logo')" 
      onmouseover=clearTimeout(xyz) ;>Menu Two</A></CENTER></TD></TR>
  <TR>
    <TD bgColor=#eeeeee>
      <CENTER><A href="javascript:void(0)" onmouseout="switchLogo('logo')" 
      onmouseover=clearTimeout(xyz) ;>Menu Three</A></CENTER></TD></TR></TBODY></TABLE></DIV>
</body>
	<!--
    	This script downloaded from www.JavaScriptBank.com
    	Come to view and download over 2000+ free javascript at www.JavaScriptBank.com
	-->