求上下浮动的图片在指定的区域内随浏览器上下滚动的js代码
上下浮动的图片在指定的区域内随浏览器上下滚动的js代码在指定区域内的浮动图片会跟着浏览器上下滚动的,但不会超出指定的范围比如一个页面左边是文章的正文,右边是联系我们等的栏...
上下浮动的图片在指定的区域内随浏览器上下滚动的js代码
在指定区域内的浮动图片 会跟着浏览器上下滚动的,但不会超出指定的范围
比如一个页面 左边是文章的正文,右边是联系我们等的栏目,但左边的文章很长,浏览器下拉的时候右边就会空出很大的空白,我想用右边的栏目滚动的方式跟这浏览器上下滚动,这样就不会看到有一大片空白 展开
在指定区域内的浮动图片 会跟着浏览器上下滚动的,但不会超出指定的范围
比如一个页面 左边是文章的正文,右边是联系我们等的栏目,但左边的文章很长,浏览器下拉的时候右边就会空出很大的空白,我想用右边的栏目滚动的方式跟这浏览器上下滚动,这样就不会看到有一大片空白 展开
2个回答
展开全部
关键代码:
main-left:左侧参照DIV;
main-right:要浮动的DIV;
div.top-box:页面顶部的Fixed层;
$(document).ready(function(){
$(window).scroll(function(){
var
leftTop = $("#main-left").offset().top;
var rightTop =
$("#main-right").offset().top;
var scrollerTop = $(this).scrollTop() +
$("div.top-box").height();
if(scrollerTop > leftTop) {
if
(scrollerTop + $("#main-right").height() < leftTop +
$("#main-left").height()){
if ($("#main-right").css("position") !=
"fixed"){
$("#main-right").css({"position":"fixed",
"left":$("#main-right").offset().left + "px", "top":$("div.top-box").height() +
"px"});
}
}else{
$("#main-right").css({"position":"fixed",
"left":$("#main-right").offset().left + "px", "top":($("div.top-box").height() -
(scrollerTop + $("#main-right").height() - (leftTop + $("#main-left").height()))
) + "px" });
}
} else {
if ($("#main-right").css("position") !=
"static"){
$("#main-right").css({"position":"static"});
}
}
});
});
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询
广告 您可能关注的内容 |