如图。蓝色的那块div的top值随滚动条的scrollTop值改变,但不能超过白色的那块区域,意思就是不能重叠到头部或底部的div上。请问如何实现。以下是我的代码,感觉累赘并且在IE6下无效。请高手指点var top_height = document.getElementById("top").offsetHeight;
var left_height = document.getElementById("left").offsetHeight; $(document).ready(function() {
$(document).scroll(function() {
var scroll_top = document.documentElement.scrollTop;
var left_top = $("#left").offset().top;
var m2_top = $("#m2").offset().top; if ((scroll_top > top_height) && (scroll_top + left_height < m2_top)) {
$("#left").css({ "top": scroll_top });
}
else {
if (scroll_top < top_height) {
$("#left").css({ "top": top_height + 20 });
}
else {
$("#left").css({ "top": m2_top - 10 - left_height });
}
} })
})
var left_height = document.getElementById("left").offsetHeight; $(document).ready(function() {
$(document).scroll(function() {
var scroll_top = document.documentElement.scrollTop;
var left_top = $("#left").offset().top;
var m2_top = $("#m2").offset().top; if ((scroll_top > top_height) && (scroll_top + left_height < m2_top)) {
$("#left").css({ "top": scroll_top });
}
else {
if (scroll_top < top_height) {
$("#left").css({ "top": top_height + 20 });
}
else {
$("#left").css({ "top": m2_top - 10 - left_height });
}
} })
})
解决方案 »
- JQuery+JQuery ui实现的弹出窗口+遮罩层+拖动+更改大小
- 开源一个超容易使用的“多集成弹出层插件”:layer v0.2
- 如何让网页中的 TEXT 获得焦点后清空
- 文本框的离开事件(在线等)
- Google的Node和Node.js是一个东西么?
- 中控指纹仪在网页上的二次开发biokey+php+JS--求案例
- 爷爷二七,散分散代码表示悼念。
- 倒计时程序的修改,如何开始/暂停两个按钮的功能改成一个
- 为什么在没有含有iframe的页面中拖拽一个浮动的div; 和在有iframe的页面中拖拽这个层的效果不一样啊(前者一切OK,后者多抓这个div几次它就
- 年终大盘点(三):最佳非技术贴!
- a标签href
- 如何让页面里的图片不读取缓存?
position:absolute;
top:10px;
}听下来这个蓝的层 和 白色的层是并列的关系所以只要放在 一个绝对为止就可以了