var class_name=function()
{
this.top=500//与顶部距离
//左侧广告
this.l_width=100//宽
this.l_height=100//高
this.l_left=100//与左侧的距离
this.l_src="http://img.baidu.com/img/logo-zhidao.gif"//图片路径
this.l_url="http://www.baidu.com/"//图片链接地址
//右侧广告
this.r_width=100//宽
this.r_height=100//高
this.r_right=100//与右侧的距离
this.r_src="http://img.baidu.com/img/logo-zhidao.gif"//图片路径
this.r_url="http://www.baidu.com/"//图片链接地址
}
var c=new class_name()
document.write('<div id="xf_left_gg" style="position:absolutewidth:'+c.l_width+'pxheigth:'+c.l_height+'pxleft:'+c.l_left+'pxtop:'+c.top+'px"><a href="'+c.l_url+'" target="_blank"><img src="'+c.l_src+'" width="'+c.l_width+'" height="'+c.l_height+'" border="0"></a></div>')
document.write('<div id="xf_right_gg" style="position:absolutewidth:'+c.r_width+'pxheigth:'+c.r_height+'px" right:'+c.r_right+'pxtop:'+c.top+'px"><a href="'+c.l_url+'" target="_blank"><img src="'+c.l_src+'" width="'+c.l_width+'" height="'+c.l_height+'" border="0"></a></div>')
function lxs_xf()
{
var t=(document.body.scrollTop>0)?(parseInt(document.body.scrollTop)+c.top):c.top
$("xf_left_gg").style.left=c.l_left+"px"
$("xf_left_gg").style.top=t+"px"
$("xf_right_gg").style.right=c.r_right+"px"
$("xf_right_gg").style.top=t+"px"
}
function $(id){return document.getElementById(id)}
if(window.attachEvent)
{
window.attachEvent("onload",lxs_xf)
window.attachEvent("onscroll",lxs_xf)
}
else
{
window.addEventListener("load",lxs_xf,false)
window.addEventListener("scroll",lxs_xf,false)
}
</script>
jsp中:<body>
<div style="position: absolutez-index:90" id="div1">我不动</div>
<div>我动<div>
</body>
//有的将position设置成fixed,我试了试效果不如position好,设置z-index,向里的深度,我这儿设置90,你要覆盖几个div,设置数大于那个数就行。
js中:
我这儿用jquery写。
$(document).ready(function(){
$(window).scroll(function(){//滚动时触发函数
$("#div1").css("top",$(document).scrollTop())//将滚动条高度赋给悬浮框。
})
})
导入jquery库,效果就出来了。
<div class="fixed" style="left: 22pxpadding-right: 196pxpadding-left: unset"><a href="javascript:" title="微信扫一扫加好友" class="codepic">
<div><img src="/skin/images/erweima1.png" class="code" style="left: 52pxtop: 0pxright: -196px"/></div>
</a>
<a href="javascript:" title="微信扫一扫加好友" class="codepic1">
<div><img src="/skin/images/erweima2.png" class="code" style="left: 52pxtop: -52pxright: -196px"/></div>
</a>
<a href="javascript:" title="淘宝扫一扫加关注" class="codepic2">
<div><img src="/skin/images/taobao.png" class="code" style="left: 52pxtop: -104pxright: -196px"/></div>
</a>
<div style="width:52pxheight: 52px"><a href="javascript:" title="返回顶部" class="backup"></a></div>
</div>
<!--页尾结束-->
<!--页尾结束-->
<!--弹窗插件开始-->
<link rel="stylesheet" type="text/css" href="/skin/css/jquery.dialogbox.css">
<div id="type-dialogBox"></div>
<script src="/skin/js/jquery.dialogbox.js"></script>
<!--弹窗插件结束-->
修改下class 分别标记,这里加了1和2 ,,,在css里面把 你刚才的代码复制下,分别标识1和2,在找到hover 里面复制改下