滑动翼片的背景在滚动/溢出部分

问题描述：

#tab_slide { 
    overflow-x: auto; // added by me for vertical scrollbar 
    overflow-y: auto; // added by me for vertical scrollbar 
    height: 100%!important; // added by me for vertical scrollbar 
    color: #000; 
    font-family: inherit; 
    font-size: 14px; 
    top: 5%; 
    position: fixed; 
    z-index: 2147483647; 
}

用于滑动标签背景CSS如下：

#tab_slide_background { 
    background: #fff; 
    box-shadow: 1px 1px 2px #000; 
    height: 100%; 
    opacity: 0.8; 
    position: absolute; 
    top: 0; 
    width: 100%; 
    z-index: -1; 
}

不幸的是，如果有任何溢出和滚动条出现时，向下滚动时没有背景。

有问题的网站是在http://thehungrygeek.com

我希望搞清楚如何使当用户向下滚动（背景出现任何帮助，即用户的显示高度大于滑动小标签内容）！

问题是 “'#tab_slide {身高：100％}'”，但如果你删除面板不会滚动了。 – Era

是的，你是对的...有没有办法让滚动面板没有得到背景搞砸了？ –

你可以使用jQuery吗？ – Era

答

获取内容的高度，然后采用相同的背景格：

<script type="text/javascript"> 
$(document).ready(function(){ 
    var heightPanel = $('#tab_slide_include').height(); 
    $('#tab_slide_background').height(heightPanel); 
}); 
</script>

加载你的jQuery文件后，添加该代码。我希望你知道你在哪里使用jQuery文件。 ;）

感谢您的帖子，你能否澄清一点关于该解决方案的实施？不知道在哪里把这些行 –

编辑我的答案。 – Era

我以前在网站上成功实现了jQuery代码。试图把你的修复，但它没有奏效。我必须使用jQuery替换$，因为它的安全模式。你可以看看网站的源代码。 –

答

好吧，放弃了在侧栏上放置一个滚动条。

最终使用：

#tab_slide { 
top: 50% 
margin-top:-410px!important; 
}

滑动翼片的背景在滚动/溢出部分

相关推荐