2011-11-30 90 views
0

我想获得一个div下滚动页面。它工作得很好,但在div在页面的底部卡住,当我尝试过远滚动:jquery滚动div推动页面底部的内容

$(function() { 
    var $sidebar = $("#sidebar"), 
     $bigPics = $("#bigPics"), 
     $window = $(window), 
     offset = $sidebar.offset(), 
     topPadding = 20, 
     turnoff = 1; 
    var documentHeight = $(document).height(); 

    $window.scroll(function() { 
     if (($window.scrollTop() > offset.top) && (documentHeight - 1200 > parseFloat($sidebar.css("marginTop")))) { 
      $sidebar.stop().animate({ 
       marginTop: $window.scrollTop() - offset.top + topPadding 
      }); 
     } else { 
      $sidebar.stop(); 
     } 
    }); 
}); 

如何让我回滚动的页面中再次启动任何想法?提前干杯

回答

0

用途:

.sidebar{ 
position:fixed; 
bottom:0; 
right:0; 
} 

/* for browser not supporting fixed position as ie6 */ 
.oldBrowser .sidebar{ 
position:absolute; 
top:expression(documentElement.scrollTop + body.scrollTop + yourExtraValue); 
} 

你需要确定什么时候有一个老的浏览器和类” .oldBrowser添加到:

$sidebar.css({'position':'absolute','top':0,'right':0}); 
var extraValue=0,sidebarHeight=$sidebar.height(); 
$window.scroll(function() { 
    $sidebar.stop(true,true).animate({ 
     top: $window.scrollTop() + $window.height() - sidebarHeight + extraValue 
    }); 
}); 

您可以轻松地使用CSS实现这一目标body标签元素当文档准备就绪时,您可以在服务器端或客户端执行此操作

0

我已经使用jquery插件

https://github.com/garand/sticky

停止在底部:

(函数($){

var limit_bottom=$('#footer').height(); 
$('.product-box').sticky({topSpacing:0, bottomSpacing:limit_bottom}); 

})(jQuery的);