跟随滚动条的漂浮图片窗体两侧

最新推荐文章于 2025-07-29 20:25:09 发布

Teng_s2000

最新推荐文章于 2025-07-29 20:25:09 发布

阅读量1.4k

点赞数

CC 4.0 BY-SA版权

分类专栏： ASP.NET Web开发文章标签： generator filter border ie javascript html

本文链接：https://blog.youkuaiyun.com/Teng_s2000/article/details/501006

ASP.NET Web开发专栏收录该内容

99 篇文章

订阅专栏

该博客主要展示了一段使用JavaScript实现浮动元素跟随页面滚动的代码。代码区分了IE和NS浏览器，通过heartBeat函数根据页面滚动的偏移量来调整浮动元素的位置，还设置了浮动元素的样式和透明度等。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

<HTML>

<HEAD>

<TITLE> New Document </TITLE>

</HEAD>

<BODY>

self.onError = null;

currentX = currentY = 0;

whichIt = null;

lastScrollX = 0; lastScrollY = 0;

NS = (document.layers) ? 1 : 0;

IE = (document.all) ? 1: 0;

function heartBeat(objectid) {

if(IE) { diffY = document.body.scrollTop; diffX = document.body.scrollLeft; }

if(NS) { diffY = self.pageYOffset; diffX = self.pageXOffset; }

if(diffY != lastScrollY) {

percent = .1 * (diffY - lastScrollY);

if(percent > 0) percent = Math.ceil(percent);

else percent = Math.floor(percent);

if(IE) {

objectid = objectid.split(";");

for (i = 0; i < objectid.length; i++) eval("document.all."+objectid[i]).style.pixelTop += percent;

}

if(NS) {

objectid = objectid.split(";");

for (i = 0; i < objectid.length; i++) eval("document."+objectid[i]).top += percent;

}

lastScrollY = lastScrollY + percent;

}

if(diffX != lastScrollX) {

percent = .1 * (diffX - lastScrollX);

if(percent > 0) percent = Math.ceil(percent);

else percent = Math.floor(percent);

if(IE) {

objectid = objectid.split(";");

for (i = 0; i < objectid.length; i++) eval("document.all."+objectid[i]).style.pixelLeft += percent;

}

if(NS) {

objectid = objectid.split(";");

for (i = 0; i < objectid.length; i++) eval("document."+objectid[i]).left += percent;

}

lastScrollX = lastScrollX + percent;

}

if(NS || IE) action = window.setInterval("heartBeat('floater;floater1')", 1);

if (IE){

document.write("<DIV id='floater' style='LEFT: 0px; TOP: 5px; POSITION: absolute; WIDTH: 80; VISIBILITY: visible; Z-INDEX: 10;filter: Alpha(Opacity=88)'><a href='http://bns.23city.com/' target='_blank'><IMG src='http://bns.23city.com/images/asp.net.jpg' height='140' width='120' border='0'></a></DIV>");

document.write("<DIV id='floater1' style='right: 0px; TOP: 5px; POSITION: absolute; WIDTH: 80; VISIBILITY: visible; Z-INDEX: 10; filter: Alpha(Opacity=88)'><a href='http://bns.23city.com/' target='_blank'><IMG src='http://bns.23city.com/images/asp.net.jpg' height='140' width='120' border='0'></a></DIV>");

}

if (NS){

document.write("<layer id=myleft top=5 width=80 height=80></layer>");