javascript写一个浮动div

最新推荐文章于 2021-06-10 17:19:01 发布

weixin_30593261

最新推荐文章于 2021-06-10 17:19:01 发布

阅读量115

点赞数

CC 4.0 BY-SA版权

文章标签： javascript ViewUI

原文链接：http://www.cnblogs.com/goodbye305/archive/2008/05/08/1188235.html

本文介绍了一种使用JavaScript实现网页元素动态定位的方法。通过三步设置，可以使特定元素如广告条等在页面底部位置显示，并随浏览器窗口大小变化而自动调整位置。

要完成此效果需要三个步骤

第一步：把如下代码加入到<head>区域中

<SCRIPT LANGUAGE="JavaScript">

function setVariables() {

imgwidth=235;

imgheight=19;

if (navigator.appName == "Netscape") {

horz=".left";

vert=".top";

docStyle="document.";

styleDoc="";

innerW="window.innerWidth";

innerH="window.innerHeight";

offsetX="window.pageXOffset";

offsetY="window.pageYOffset";

}

else {

horz=".pixelLeft";

vert=".pixelTop";

docStyle="";

styleDoc=".style";

innerW="document.body.clientWidth";

innerH="document.body.clientHeight";

offsetX="document.body.scrollLeft";

offsetY="document.body.scrollTop";

}

}

function checkLocation() {

objectXY="branding";

var availableX=eval(innerW);

var availableY=eval(innerH);

var currentX=eval(offsetX);

var currentY=eval(offsetY);

x=availableX-(imgwidth+30)+currentX;

y=availableY-(imgheight+65)+currentY;

evalMove();

setTimeout("checkLocation()",10);

}

function evalMove() {

eval(docStyle + objectXY + styleDoc + horz + "=" + x);

eval(docStyle + objectXY + styleDoc + vert + "=" + y);

}

</script>

第二步：把如下代码加入到<body>区域中

<div id="branding" style="position:absolute; visibility:show; left:235px; top:50px; z-index:2">

<table width=10 ><td>

<a href="http://free.2259.com/" onmouseover="window.status='Typhoon Start';return true" onmouseout="window.status='';return true"><center>

<img src="2259.gif" border="0">

</center></a></font></td>

</table>

</div>

第三步：把“onload="setVariables(); checkLocation();"”加到<body>标记中
例如：<body onload="setVariables(); checkLocation();">

转载于:https://www.cnblogs.com/goodbye305/archive/2008/05/08/1188235.html

评论

被折叠的条评论为什么被折叠?

到【灌水乐园】发言

查看更多评论

添加红包

成就一亿技术人!

hope_wisdom

发出的红包

实付元

使用余额支付

点击重新获取

扫码支付

钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。