JS浮动层

最新推荐文章于 2021-06-29 17:21:26 发布

congjl2002

最新推荐文章于 2021-06-29 17:21:26 发布

阅读量221

点赞数

分类专栏：【转】实用文章标签： JavaScript IE QQ Firefox 浏览器 ViewUI

本文链接：https://blog.csdn.net/congjl2002/article/details/83320854

版权

【转】实用专栏收录该内容

39 篇文章 0 订阅

订阅专栏

转自：http://www.cnblogs.com/jailu/archive/2006/10/24/538421.html

一、把以下代码插入<body></body>标签中：

 <div id="FloatDIV" style="position: absolute;top: 0px; border-right: activeborder 1px solid; border-top: activeborder 1px solid; border-left: activeborder 1px solid; border-bottom: activeborder 1px solid;">
         浮动层示例：<br />
              <a target="_blank" href="tencent://message/?uin=101535223&Site=http://www.jailusd.com&Menu=yes"><img border="0" src="http://wpa.qq.com/pa?p=1:101535223:3" alt="有事您说话"></a>
    </div>

二、把以下代码插到</body>标签之后，设置MarginLeft、MarginTop、Width、Heigth四个变量的值

<script language="javascript" type="text/javascript">
var MarginLeft = 30;   //浮动层离浏览器右侧的距离
var MarginTop = 50;     //浮动层离浏览器顶部的距离
var Width = 120;        //浮动层宽度
var Heigth= 45;        //浮动层高度

//设置浮动层宽、高
function Set()
{
    document.getElementById("FloatDIV").style.width = Width;
    document.getElementById("FloatDIV").style.height = Heigth;
}

//实时设置浮动层的位置
function Move()
{
    document.getElementById("FloatDIV").style.top = document.documentElement.scrollTop + MarginTop;
    document.getElementById("FloatDIV").style.left = document.documentElement.clientWidth - Width - MarginLeft;
    setTimeout("Move();",100);
}

Set();
Move();
</script>

经测试，上面的代码在IE中运行通过，但是FireFox里却不好用，查了一下，发现是语法在FF里要求更严格造成的问题，将所有设置宽度长度值的后面加上单位就可以在ff中运行了，如下：

document.getElementById("FloatDIV").style.width = Width + "px";

congjl2002

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
JS浮动层

转自：http://www.cnblogs.com/jailu/archive/2006/10/24/538421.html一、把以下代码插入&lt;body&gt;&lt;/body&gt;标签中： &lt;div id="FloatDIV" style="position: absolute;top: 0px; border-right: activeborder 1px solid; b...
复制链接

扫一扫