滚动HTML元素的内容,而不是整个窗口对象

时间:2014-05-09 13:11:43

标签: javascript html css scroll

我手中有以下两个:

#elementA {
    position: absolute;
    width: 200%;
    height: 100%;
    background: linear-gradient(to right, rgba(100,0,0,0.3), rgba(0,0,250,0.3));
    z-index: 250;
}

#containerofA {
    position: fixed;
    width: 100%;
    height: 100%;
    z-index: 240;
    padding-bottom: 100px;  // to hide the horizontal scrollbar
    overflow-x: scroll;
}

作为elementA的{​​{1}}再次显示在divcontainerofAdiv的宽度是容器的两倍,并且可以使用支持触摸的设备滚动。

这些事情已经发生了。我所追求的是让elementA最初滚动到中间。我希望它最初位于elementA,或者在加载时向右滚动-50%

在JavaScript,CSS或HTML中:如何做到这一点?

如果可以的话,

50%和变体滚动整个窗口。这应该是一件容易的事,但我看不出......

4 个答案:

答案 0 :(得分:2)

使用dom元素的scrollLeft属性。

http://jsfiddle.net/hCN7n/

document.getElementById('containerofA').scrollLeft = 250;

答案 1 :(得分:1)

尝试这样的事情:

 $(window).load(function() {
    $(element).scrollLeft(offset-left);
});

答案 2 :(得分:0)

您可以使用scrollTopscrollLeft属性。

答案 3 :(得分:0)

为什么不这样做:

.Container{
position:fixed;
width:100%;
height:100%;
overflow-x:scroll;
overflow-y:hidden;
}

.Elementcontained{
position:absolute;
margin:auto;
left:0;right:0;bottom:0;top:0;
width:200%;
height:100%;
}

这应该有用吗?