zl程序教程

您现在的位置是:首页 >  前端

当前栏目

html左侧浮动广告代码,如何制作浮动广告 JavaScript制作浮动广告代码

JavaScriptHTML代码 如何 制作 广告 浮动 左侧
2023-06-13 09:14:45 时间

大家好,又见面了,我是你们的朋友全栈君。

如果有一定的JavaScript基础,制作浮动广告还是比较容易的。直接上代码了:

无标题文档

*{

margin:0;

padding:0;

}

#csdn

{

width:800px;

margin:0 auto;

}

#ad

{

position:absolute;

right:0px;

top:30px;

z-index:1;

}

#cl

{

position:absolute;

right:0px;

top:30px;

z-index:2;

}

var advInitTop=30;

var closeInitTop=30;

function inix()

{

advInitTop=document.getElementById(“ad”).style.pixelTop;

closeInitTop=document.getElementById(“cl”).style.pixelTop;

}

function closeAd()

{

document.getElementById(“ad”).style.display=”none”;

document.getElementById(“cl”).style.display=”none”;

}

function move()

{

//document.getElementById(“ad”).style.pixelTop=document.body.scrollTop+advInitTop;

//document.getElementById(“cl”).style.pixelTop=document.body.scrollTop+closeInitTop;

document.getElementById(“ad”).style.pixelTop=document.documentElement.scrollTop+advInitTop;

document.getElementById(“cl”).style.pixelTop=document.documentElement.scrollTop+closeInitTop;

//alert(document.getElementById(“ad”).style.pixelTop);

window.status=document.documentElement.scrollTop+”/”+document.getElementById(“ad”).style.pixelTop;

}

window.οnscrοll=move;

要点:

上述代码中要用document.documentElement ,不要用老的document.body,否则,不符合w3c标准,看不到浮动效果!

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 举报,一经查实,本站将立刻删除。

发布者:全栈程序员栈长,转载请注明出处:https://javaforall.cn/191244.html原文链接:https://javaforall.cn