Question

我知道这个话题已经经常发布，但到目前为止，所提出的解决方案都没有给我任何帮助。我的页面左侧有一个侧边栏，我在CSS中分配了position:fixed，我想要水平滚动（以及我页面上的所有其他内容）

对于我的页眉和页脚，我解决了这样的问题：

 $(window).scroll(function ()
{
    $("header,footer").css('margin-left', -($(window).scrollLeft()) + "px");
});

但这不适合我的侧边栏。这是我的侧边栏的html：

<div class="fullscreen_block hided">
   <div class="left-sidebar-block">

和CSS：

.left-sidebar-block { 
position: fixed; 
margin-left: 70px;
}

有人能告诉我如何在不使用上述JS代码的情况下解决这个问题吗？（任何其他JS或CSS或jQuery都可以）

谢谢！

Answer 1

首先，我想您要使用scrollTop代替scrollLeft。根据您的描述，听起来您希望在用户向下滚动时向左滑动元素。 scrollTop将为您提供用户滚动的距离。

其次，我建议使用transform属性而不是margin属性，只要它符合您的浏览器支持要求即可。滚动技巧通常是性能密集型的，因此您应该尝试使用transform和opacity等高性能css属性，而不是像margin，left和{{1}这样的较慢属性}。

以下代码执行我认为您尝试执行的操作。（Codepen演示：http://codepen.io/regdoug/pen/yyYvaV）：

display

参考

Answer 2

你的问题不是很清楚..但我认为你更好地使用“左”属性而不是“左边缘”。边距不会对固定元素产生任何影响..