网页中的DIV层随着页面移动而移动

急急急急啊用DIV+JS使DIV能随着页面上下滚动也跟着滚动（意思就是说，不管你把页面往下拉多远，DIV始终保持在你屏幕的同一个位置），请大家帮忙了，写一个简洁的。希望你... 急急急急啊用DIV+JS使DIV 能随着页面上下滚动也跟着滚动（意思就是说，不管你把页面往下拉多远，DIV始终保持在你屏幕的同一个位置），请大家帮忙了，写一个简洁的。希望你们把所有代码都写给我，让我学习学习，谢谢！展开

 我来答

3个回答

#热议# 上班途中天气原因受伤算工伤吗？

想恋一个人
2012-02-07 · 超过19用户采纳过TA的回答

知道答主

回答量：81

采纳率：0%

帮助的人：65.7万

我也去答题访问个人页

关注

展开全部

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
<style>
div{
text-decoration:none}
#Layer1 {
position:absolute;
width:56px;
height:17px;
z-index:1;
left: 215px;
top: 195px;
}
a{
text-decoration:none}
</style>
<script>
var picTop = 0;
var closeTop = 0;

var picTop2 = 0;
var closeTop2 = 0;
function initPic(){
picTop = document.getElementById('pic').style.pixelTop;
closeTop = document.getElementById('picClose').style.pixelTop - 10;

picTop2 = document.getElementById('pic2').style.pixelTop;
closeTop2 = document.getElementById('picClose2').style.pixelTop - 10;
}
function autoPic(){
document.getElementById('pic').style.pixelTop = picTop + document.body.scrollTop;
document.getElementById('picClose').style.pixelTop = closeTop + document.body.scrollTop;

document.getElementById('pic2').style.pixelTop = picTop2 + document.body.scrollTop;
document.getElementById('picClose2').style.pixelTop = closeTop2 + document.body.scrollTop;
}
function myclose1(){
document.getElementById('pic').style.display = "none";
document.getElementById('picClose').style.display = "none";
}

function myclose2(){
document.getElementById('pic2').style.display = "none";
document.getElementById('picClose2').style.display = "none";
}
window.onscroll = autoPic;
</script>
</head>

<body onLoad="initPic()" style=" font-size:12px">
<div id="pic" style="position:absolute;"><img src="images/CatEatsCorn.gif" width="261" height="196" /></div>
 
a
a
aa<div id="pic2" style="position:absolute; left: 1014px; top: 11px;"><img src="images/CatEatsCorn.gif" width="261" height="196" /></div>

a
<div id="picClose" style="position:absolute; z-index:5; top:190; left:230"><a href="javaScript:myclose1()">X_关闭</a></div>
</div>
 
a
<div id="picClose2" style="position:absolute; z-index:5; top:193px; left:1224px; width: 51px;"><a href="javaScript:myclose2()">X_关闭</a></div>

a
aa
a
a
a
a
 
aa
a
a
a
a
a
a
a
a
a
a
a
a
 
a
a
a
a
a
a
a
a
 
 
</body>
</html>

已赞过 已踩过<

评论收起

武汉市江夏区智云聚网络..

广告2024-12-24

提升企业形象，从网站建设开始!网站建设流程简单易懂，让您轻松掌握网站建设技巧!

qianhu.wejianzhan.com

273142650
2012-02-06 · TA获得超过542个赞

知道小有建树答主

回答量：396

采纳率：0%

帮助的人：233万

我也去答题访问个人页

关注

展开全部

默认情况下单纯CSS就可以实现 就是把定位方式修改一下 比如 position:fixed; 相对于浏览器定位

你可以试试 

不过这个在IE6下是不好使的 IE6不支持 所以你得用JS来做

原理就是把定位设置为 position:absolute; 这个定位是相对于BODY定位的 所以当你页面往下拉的时候 要把此DIV的TOP加上滚动条滚动过的距离加上 这样就可以相对于浏览器定位了

本回答被提问者采纳

已赞过已踩过<

你对这个回答的评价是？
评论收起

等待放飞梦想
2012-02-06 · TA获得超过1175个赞

知道小有建树答主

回答量：1696

采纳率：16%

帮助的人：718万

我也去答题访问个人页

关注

展开全部

/*
*Name: 滚动DIV
*Date: 2011年7月15日10:51
*Arguments: a ==> 对像 || b ==> top值 ||c ==> 滚动速度(默认500ms)
*/
var Util = {};
Util.scrollDIV = function (a,b,c){
var d = $(a);
var s =Util.pageSize.get();
d.css({position:"absolute",top: b+"px"});
$(window).scroll(function (){
var g = parseInt(b) + $(window).scrollTop();
d.animate({top : g+"px" },{ duration: c || 350 , queue:false });
});
};