临时需要用,写了一个简易的基于Jquery的浮动插件。浮动层自身没有定义外观。 /* 图层浮动 elementId:指定浮动ID position:位置参数 TOP:网页顶部,CENTER:中间,BOTTOM:底部 styleCss:初始化对象的样式,可选参数 */ function Float(elementId,postion,styleCss){ this.id = elementId; this.div = $("#"+this.id); this.scrollTop = 0; this.screenHeight = window.screen.height-window.screenTop; this.topPx = rePosition(postion,this); div.css({"position":"absolute","top":topPx+"px"}); if(arguments.length > 2) $.each(styleCss,function(i,n){ div.css(i,n); }); var scrollObj = $.browser.msie ? document.documentElement : document.body; var Expression = null; window.onscroll = function(){ this.scrollTop = scrollObj.scrollTop; this.topPx = rePosition(postion,this); div.stop(true).animate({"top":this.topPx},500); } } function rePosition(postion,obj){ switch(postion){ case "TOP": obj.topPx = obj.scrollTop; break; case "CENTER": obj.topPx = (obj.scrollTop + ( obj.screenHeight / 2)); break; case "BOTTOM": obj.topPx = obj.screenHeight + obj.scrollTop - div.height()-60; } return obj.topPx; } 调用方法 <!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"> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title>无标题文档</title> <mce:script type="text/javascript" src="js_1/jquery.js" mce_src="js_1/jquery.js"></mce:script> <mce:script type="text/javascript" src="js_1/scrool.js" mce_src="js_1/scrool.js"></mce:script> <mce:script type="text/javascript"><!-- $(document).ready(function(){ var div = Float("test","CENTER",{"color":"red"}); }); // --></mce:script> <mce:style><!-- *{margin:0px;} --></mce:style><style mce_bogus="1">*{margin:0px;}</style> </head> <body style="height:1500px"> <div id="test">确定修改</div> </body> </html>