读书人

浮动效果firefox下失效了,该如何解决

发布时间: 2012-03-07 09:13:51 作者: rapoo

浮动效果firefox下失效了
<!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 " xml:lang= "zh-CN " lang= "zh-CN ">
<head>
<title> new document </title>
<meta http-equiv= "Content-Type " content= "text/html; charset=gb2312 " />
<meta name= "author " content= " ">
<meta name= "keywords " content= " ">
<meta name= "description " content= " ">
<style>
#floatBox{position:absolute;border:2px solid #ccc;width:100px;height:200px;background:#f5f5f5;}
</style>
<script>
recordPositionY = 0;
function FloatPosition()
{
var recordScrollTop = 0;
if(document.documentElement && document.documentElement.scrollTop)
{
recordScrollTop = document.documentElement.scrollTop;
}
else
{
if(document.body)
{
recordScrollTop = document.body.scrollTop;
}
}
var movePixY = 0.2 * (recordScrollTop - recordPositionY);
if(movePixY > 0)
{
movePixY = Math.ceil(movePixY);
}
else
{
movePixY = Math.floor(movePixY);
}
obj=document.getElementById( "floatBox ");
var basketTop = obj.style.pixelTop;
obj.style.pixelTop = basketTop + movePixY;
recordPositionY = recordPositionY + movePixY;
}
window.setInterval( "FloatPosition() ",2);
</script>
</head>

<body>
<div id= "floatBox ">
这是浮动的窗口
<input type= "button " value= "固定位置 " />
</div>
<p> 为什么不能在firefox下漂浮?点击固定位置之后又如何让它固定在最开始的位置呢? </p> <p> 为什么不能在firefox下漂浮?点击固定位置之后又如何让它固定在最开始的位置呢? </p> <p> 为什么不能在firefox下漂浮?点击固定位置之后又如何让它固定在最开始的位置呢? </p> <p> 为什么不能在firefox下漂浮?点击固定位置之后又如何让它固定在最开始的位置呢? </p> <p> 为什么不能在firefox下漂浮?点击固定位置之后又如何让它固定在最开始的位置呢? </p> <p> 为什么不能在firefox下漂浮?点击固定位置之后又如何让它固定在最开始的位置呢? </p> <p> 为什么不能在firefox下漂浮?点击固定位置之后又如何让它固定在最开始的位置呢? </p> <p> 为什么不能在firefox下漂浮?点击固定位置之后又如何让它固定在最开始的位置呢? </p> <p> 为什么不能在firefox下漂浮?点击固定位置之后又如何让它固定在最开始的位置呢? </p> <p> 为什么不能在firefox下漂浮?点击固定位置之后又如何让它固定在最开始的位置呢? </p> <p> 为什么不能在firefox下漂浮?点击固定位置之后又如何让它固定在最开始的位置呢? </p> <p> 为什么不能在firefox下漂浮?点击固定位置之后又如何让它固定在最开始的位置呢? </p> <p> 为什么不能在firefox下漂浮?点击固定位置之后又如何让它固定在最开始的位置呢? </p> <p> 为什么不能在firefox下漂浮?点击固定位置之后又如何让它固定在最开始的位置呢? </p> <p> 为什么不能在firefox下漂浮?点击固定位置之后又如何让它固定在最开始的位置呢? </p> <p> 为什么不能在firefox下漂浮?点击固定位置之后又如何让它固定在最开始的位置呢? </p> <p> 为什么不能在firefox下漂浮?点击固定位置之后又如何让它固定在最开始的位置呢? </p> <p> 为什么不能在firefox下漂浮?点击固定位置之后又如何让它固定在最开始的位置呢? </p> <p> 为什么不能在firefox下漂浮?点击固定位置之后又如何让它固定在最开始的位置呢? </p> <p> 为什么不能在firefox下漂浮?点击固定位置之后又如何让它固定在最开始的位置呢? </p> <p> 为什么不能在firefox下漂浮?点击固定位置之后又如何让它固定在最开始的位置呢? </p> <p> 为什么不能在firefox下漂浮?点击固定位置之后又如何让它固定在最开始的位置呢? </p> <p> 为什么不能在firefox下漂浮?点击固定位置之后又如何让它固定在最开始的位置呢? </p> <p> 为什么不能在firefox下漂浮?点击固定位置之后又如何让它固定在最开始的位置呢? </p> <p> 为什么不能在firefox下漂浮?点击固定位置之后又如何让它固定在最开始的位置呢? </p> <p> 为什么不能在firefox下漂浮?点击固定位置之后又如何让它固定在最开始的位置呢? </p> <p> 为什么不能在firefox下漂浮?点击固定位置之后又如何让它固定在最开始的位置呢? </p> <p> 为什么不能在firefox下漂浮?点击固定位置之后又如何让它固定在最开始的位置呢? </p> <p> 为什么不能在firefox下漂浮?点击固定位置之后又如何让它固定在最开始的位置呢? </p> <p> 为什么不能在firefox下漂浮?点击固定位置之后又如何让它固定在最开始的位置呢? </p> <p> 为什么不能在firefox下漂浮?点击固定位置之后又如何让它固定在最开始的位置呢? </p> <p> 为什么不能在firefox下漂浮?点击固定位置之后又如何让它固定在最开始的位置呢? </p> <p> 为什么不能在firefox下漂浮?点击固定位置之后又如何让它固定在最开始的位置呢? </p> <p> 为什么不能在firefox下漂浮?点击固定位置之后又如何让它固定在最开始的位置呢? </p>


</body>
</html>

以上是自己的代码。
这里有两个问题:
1、这段代码在ie下没有问题,浮动框会跟着滚动条的滚动而滚动,但在firefox下却不能动,请问一下哪里出问题呢??

2、我想点击一下“固定位置”之后,那浮动框就会回到原来的位置而不动,但它的字体变为了“漂浮”,点击漂浮之后就又继续漂浮,请问一下这个效果又怎么做呢?

谢谢了。



[解决办法]
firefox对脚本的有求很严格, 可能存在写法上的问题
[解决办法]
你的取值有问题吧
把那个执行的放在最后
[解决办法]
<script>
var curY = 0;
var offY = 0;
var abY = 0;
function FloatPosition()
{
var obj = document.getElementById( "floatBox ");
curY = Math.ceil(obj.style.top.replace(/px/, " "));
abY = Math.ceil(document.documentElement.scrollTop);
offY = 0.2 * (abY - curY);
curY += offY;
obj.style.top = String(curY) + "px ";
}
window.setInterval( "FloatPosition() ",2);
</script>

try this

读书人网 >JavaScript

热点推荐