当前位置：Gxlcms > JavaScript > 标准布局应用：对联与旗帜

标准布局应用：对联与旗帜

时间：2021-07-01 10:21:17 帮助过：13人阅读

<!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> 
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> 
<meta name="description" content="http://blog.pr1984.com - 代码剪辑库 ( PR 50198763 )" /> 
<title>符合标准的正常工作的对联广告</title> 
<script type="text/javascript"> 
<!--  
lastScrollY = 0; 
function heartBeat(){  
var diffY; 
if (document.documentElement && document.documentElement.scrollTop) 
 diffY = document.documentElement.scrollTop; 
else if (document.body) 
 diffY = document.body.scrollTop 
else 
    {/*Netscape stuff*/} 
  
//alert(diffY); 
percent=.1*(diffY-lastScrollY);  
if(percent>0)percent=Math.ceil(percent);  
else percent=Math.floor(percent);  
document.getElementById("leftDiv").style.top = parseInt(document.getElementById("leftDiv").style.top)+percent+"px"; 
document.getElementById("rightDiv").style.top = parseInt(document.getElementById("leftDiv").style.top)+percent+"px";

lastScrollY=lastScrollY+percent;  
//alert(lastScrollY); 
}

//下面这段删除后，对联将不跟随屏幕而移动。 
window.setInterval("heartBeat()",1); 
//--> 
</script>

/* 这里是设置对联样式滴 */ 
#leftDiv,#rightDiv{ 
   width:120px; /* 宽度 */ 
   height:250px; /* 高度 */ 
   background-color:#e5e5e5; /* 背景颜色 */ 
   border:1px solid #ddd; /* 边框样式 */ 
   position:absolute; /* 绝对定位激活 */ 
} 
--> 
</style> 
</head>

<body>

左侧广告内容 
右侧广告内容

</body> 
</html>

[Ctrl+A 全选注:如需引入外部Js需刷新才能执行]

标准布局应用：对联与旗帜

人气教程排行