JS浮动层

本文提供了一段简单的浮动广告层JavaScript代码实现。该代码可在网页上创建一个随滚动条移动的浮动广告窗口,并设置了浮动层的宽高及与浏览器边缘的距离。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

朋友叫我帮找一个浮动广告层的JS特效代码,在网上找了不少都有错就随手写了一个。 点击查看效果

一、把以下代码插入<body></body>标签中:
None.gif      < div  id ="FloatDIV"  style ="position: absolute;top: 0px; border-right: activeborder 1px solid; border-top: activeborder 1px solid; border-left: activeborder 1px solid; border-bottom: activeborder 1px solid;" >
None.gif        
&nbsp; 浮动层示例: < br  />
None.gif        
&nbsp;   &nbsp;   &nbsp;   < target ="_blank"  href ="tencent://message/?uin=101535223&Site=http://www.jailusd.com&Menu=yes" >< img  border ="0"  src ="http://wpa.qq.com/pa?p=1:101535223:3"  alt ="有事您说话" ></ a >
None.gif    
</ div >

二、把以下代码插到</body>标签之后,设置MarginLeft、MarginTop、Width、Heigth四个变量的值
None.gif < script language = " javascript "  type = " text/javascript " >
None.gif
var  MarginLeft  =   30 ;    // 浮动层离浏览器右侧的距离
None.gif
var  MarginTop  =   50 ;      // 浮动层离浏览器顶部的距离
None.gif
var  Width  =   120 ;         // 浮动层宽度
None.gif
var  Heigth =   45 ;         // 浮动层高度
None.gif

None.gif
// 设置浮动层宽、高
None.gif
function  Set()
ExpandedBlockStart.gifContractedBlock.gif
dot.gif {
InBlock.gif    document.getElementById(
"FloatDIV").style.width = Width;
InBlock.gif    document.getElementById(
"FloatDIV").style.height = Heigth;
ExpandedBlockEnd.gif}

None.gif
None.gif
// 实时设置浮动层的位置
None.gif
function  Move()
ExpandedBlockStart.gifContractedBlock.gif
dot.gif {
InBlock.gif    document.getElementById(
"FloatDIV").style.top = document.documentElement.scrollTop + MarginTop;
InBlock.gif    document.getElementById(
"FloatDIV").style.left = document.documentElement.clientWidth - Width - MarginLeft;
InBlock.gif    setTimeout(
"Move();",100);
ExpandedBlockEnd.gif}

None.gif
None.gifSet();
None.gifMove();
None.gif
</ script >

转载于:https://www.cnblogs.com/jailu/archive/2006/10/24/538421.html

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值