Javascript CSS 位置固定为水平滚动但垂直滚动
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/14274841/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Css position fixed for horizontal scroll but scroll vertically
提问by user850234
I have three divas below :
我有div以下三个:
<div id="left"></div>
<div id="center"><table></table></div>
<div id="right"></div>
Now what i need to do is to keep #leftand #rightfixed for horizontal scroll and scroll #centeronly. This is working with css position:fixedfor #leftand #right. But the problem is when i scroll html page vertically i need all the div'si.e. #left,#centerand #rightto scroll. This is not working. Please anyone help me how to do it so that #leftand #rightscrolls vertically along with #centerand remains fixed for horizontal scroll. I have no clue how to do it using css and make it work.
现在我需要做的是仅保留#left和#right固定水平滚动和滚动#center。这与 css position:fixedfor #leftand 一起使用#right。但问题是,当我滚动的HTML页面垂直我需要所有的div's即#left,#center和#right滚动。这是行不通的。请任何人帮助我如何做到这一点,#left并#right与#center水平滚动一起垂直滚动并保持固定。我不知道如何使用 css 来完成它并使其工作。
回答by ATOzTOA
Try this link, it uses a plugin called scrollspyto do the stuff. Pretty easy...
试试这个链接,它使用一个插件scrollspy来做这些事情。挺容易...
http://www.rickyh.co.uk/css-position-x-and-position-y/
http://www.rickyh.co.uk/css-position-x-and-position-y/
Also, see this SO question: CSS: fixed position on x-axis but not y?
另外,请参阅这个问题:CSS: fixed position on x-axis but not y?
Thanks to semir.babajic: here is the actual snippet. You will need jQuery.
感谢semir.babajic:这是实际的片段。您将需要 jQuery。
$(window).scroll(function(){
$('#header').css({
'left': $(this).scrollLeft() + 15 //Always 15px from left
});
});

