文章目录[隐藏]
知识点
- 页面加载事件
body的onload事件，是页面加载事件，页面打开，或每次刷新时调用，而且只会这时候执行一次。
- 窗口的事件调用函数必须
Window.onscroll=函数名;
- 字符串类型转换成数值： parseFloat(变量);
- 超链接调用JS函数：
<a href="javascript:CloseGuanggao();"> 关 闭 </a>
或者
<a href="javascript:void(null);" onclick="CloseGuanggao()"> 关 闭 </a>
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 |
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>重蔚自留地两侧广告代码</title> </head> <body style="overflow-x:hidden;" onload="Init()"> <img src="https://www.cwhello.com/wp-content/uploads/2018/04/bg.jpg" height="1000px" /> <div id="divguanggao" name="divguanggao" style="z-index:1; position:absolute; width:120px; height:400px; top:8px; left:3px; float:left;"> <a href="http://www.goodjobs.cn"><img src="https://www.cwhello.com/wp-content/uploads/2018/04/guanggao.jpg" /></a> <div style="z-index:2; position:absolute; left: 77px; top: 9px;"><a href="javascript:void(null);" onclick="CloseGuanggao()"> 关 闭 </a></div> </div> <div id="divguanggao" name="divguanggao" style="z-index:1; position:absolute; top:8px; left:1143px;"> <img src="https://www.cwhello.com/wp-content/uploads/2018/04/guanggao.jpg" /> </div> </body> <script language="javascript" type="text/javascript"> //初始化，获取广告DIV的顶部 var y=0; function Init(){ var divguanggao=document.getElementsByName("divguanggao")[0]; var pxp=divguanggao.style.top.indexOf("px");//lastIndexOf y=divguanggao.style.top.substr(0,pxp); y=parseFloat(y);//字符串类型和数值转换 } //滚动广告跟随 function GuanggaoScroll(){ var st=document.body.scrollTop;//获取垂直方向滚动的距离 var divguanggaoes=document.getElementsByName("divguanggao"); for(var i=0;i<divguanggaoes.length;i++){ divguanggaoes[i].style.top=(y+st)+"px"; } } //关闭2个广告 function CloseGuanggao(){ var divguanggaoes=document.getElementsByName("divguanggao"); for(var i=0;i<divguanggaoes.length;i++){ divguanggaoes[i].style.display="none"; } } window.onscroll=GuanggaoScroll;//不能放小括号 </script> </html> |
欢迎分享本文，转载请保留出处！—重蔚自留地 站长邮箱：951076433@qq.com
发表评论