固定侧栏内部包装div

嗨我一直在试图使固定侧栏内包装div但没有运气。该页面为http://www.rayshaft.com/sample.html，我需要边栏保持固定状态，同时向下滚动其他新闻栏目。截面结构是这样的：固定侧栏内部包装div

<section class="secondary"> 
<section id="sidebar"> 
... 
</section> 
<section id="othernews"> 
... 
</section>

我试图“次要”部分，固定的，即实际上相对固定侧栏到浏览器窗口内的绝对定位，我试图此查询这似乎是准确我需要：http://jsfiddle.net/bryanjamesross/VtPcm/但我无法使它与我的页面一起工作。任何想法我做错了什么？在此先感谢

来源

2012-04-15 Jenya Muraveva

欢迎SO。这对我们来说很难分析。尝试分解页面，直到达到预期的效果。然后再建立，同时保持效果。 – NGLN 2012-04-15 11:21:47

可能有另一种方法让我获得理想的效果吗？ – 2012-04-15 11:30:20

嗯，打破页面实际上帮助感谢。我想我在我的html的某个地方弄错了，但我用这个样本http://jsfiddle.net/bryanjamesross/VtPcm/来再次构建我的页面，现在一切正常 – 2012-04-15 12:56:32

尝试使用.position()而不是.offset()和脚本的结尾处，删除多余的符号â€‹

$(function() { 
    var top = $('#sidebar').position().top - parseFloat($('#sidebar').css('marginTop').replace(/auto/, 0)); 
    var footTop = $('#footer').position().top - parseFloat($('#footer').css('marginTop').replace(/auto/, 0)); 
    var maxY = footTop - $('#sidebar').outerHeight(); 
$(window).scroll(function(evt) { 
    var y = $(this).scrollTop(); 
    if (y > top) { 
     if (y < maxY) { 
      $('#sidebar').addClass('fixed').removeAttr('style'); 
     } else { 
      $('#sidebar').removeClass('fixed').css({ 
       position: 'absolute', 
        top: (maxY - top) + 'px' 
      }); 
     } 
    } else { 
     $('#sidebar').removeClass('fixed'); 
    } 
}); 
}); //â€‹ What are this symbols ???? remove them!

来源

2012-04-15 11:32:52

固定侧栏内部包装div

回答

相关问题