[英]Css position fixed for horizontal scroll but scroll vertically
I have three div
as 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 #left
and #right
fixed for horizontal scroll and scroll #center
only. 现在我需要做的是保持
#left
和#right
固定为水平滚动并仅滚动#center
。 This is working with css position:fixed
for #left
and #right
. 这适用于css
position:fixed
为#left
和#right
。 But the problem is when i scroll html page vertically i need all the div's
ie #left
, #center
and #right
to scroll. 但问题是当我垂直滚动html页面时,我需要所有的
div's
即#left
, #center
和#right
来滚动。 This is not working. 这不起作用。 Please anyone help me how to do it so that
#left
and #right
scrolls vertically along with #center
and remains fixed for horizontal scroll. 请任何人帮我如何做到这一点,以便
#left
和#right
与#center
一起垂直滚动,并保持水平滚动固定。 I have no clue how to do it using css and make it work. 我不知道如何使用css并使其工作。
Try this link, it uses a plugin called scrollspy
to do the stuff. 试试这个链接,它使用一个名为
scrollspy
的插件来完成这些工作。 Pretty easy... 相当容易...
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:x轴上的固定位置但不是y?
Thanks to semir.babajic : here is the actual snippet. 感谢semir.babajic :这是实际的片段。 You will need jQuery.
你需要jQuery。
$(window).scroll(function(){
$('#header').css({
'left': $(this).scrollLeft() + 15 //Always 15px from left
});
});
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.