首页 诗词 字典 板报 句子 名言 友答 励志 学校 网站地图
当前位置: 首页 > 教程频道 > 网站开发 > JavaScript >

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

2012-03-07 
浮动效果firefox下失效了!DOCTYPEhtmlPUBLIC-//W3C//DTDXHTML1.0Transitional//EN http://www.w3.org/

浮动效果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

热点排行