javascript漂浮框消失问题

JavaScript04

javascript漂浮框消失问题,第1张

下面的代码调试通过，满足你的要求：

<div id="ad" style="position:absolute">

<a href="abc/abcd.htm" target="_blank">

<img src="PIC_0886.jpg" border="0">

</a></div>

<script>

var x = 50,y = 60

var xin = true, yin = true

var step = 1

var delay = 10

var obj=document.getElementById("ad")

function floatAD() {

var L=T=0

var R= document.body.clientWidth-obj.offsetWidth

var B = document.body.clientHeight-obj.offsetHeight

obj.style.left = x + document.body.scrollLeft

obj.style.top = y + document.body.scrollTop

x = x + step*(xin?1:-1)

if (x <L) { xin = truex = L}

if (x >R){ xin = falsex = R}

y = y + step*(yin?1:-1)

if (y <T) { yin = truey = T }

if (y >B) { yin = falsey = B }

}

var itl= setInterval("floatAD()", delay)

obj.onmouseover=function(){clearInterval(itl)}

obj.onmouseout=function(){itl=setInterval("floatAD()", delay)}

setTimeout("clearInterval(itl)ad.style.display='none'",5000)

</script>

你以前的代码第一行是多的，应该删除，我增加的一行实现5秒后取消，你把5000改为15000就能15秒取消。

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,

此 class 代码为

.fudong{

position: absolute

z-index: 99999

top: 0

bottom: 0

margin: auto

}

这里写的是居中悬浮，你想要什么位置，通过top bottom left right 四种属性来控制。