首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >问答首页 >控制没有插件的水平滚动条的位置

控制没有插件的水平滚动条的位置
EN

Stack Overflow用户
提问于 2012-02-10 20:31:44
回答 1查看 11.7K关注 0票数 0

我需要你的帮助。也许一个提示就足够了。一些我没见过的..。

我希望水平滚动条(类滚动)动态scrollLeft到div的可视部分的开始与类的权利。请看一下css-part中的注释。

divs (类: left/right)的宽度稍后会动态变化。因此,我必须以某种方式将滚动条定位到右侧部分的开头。

边框始终位于屏幕的中间。右边的部分应该放在边框的右边,左边的部分放在左边。

你知道怎么做吗?我知道这很难解释。请问吧。

这是我的代码片段。

代码语言:javascript
运行
复制
<!-- HTML -->
<div class="width100">
    <div class="scroll">
        <div class="outer">
            <div class="border"></div>
            <div class="left"></div>
            <div class="right"></div>
        </div>
    </div>
</div>

-

代码语言:javascript
运行
复制
<!-- CSS -->
.width {
    width:100%;
}
.scroll {
    overflow-x: scroll;
}
.outer {
    width: 960px;
    height: 55px;
    background-color: orange;
}
.border {
    width: 2px;
    height: 55px;
    margin-left:50%;
    position:absolute;
    background-color:black; // will be background-image with width: 960px;
}
.left {
    float: left;
    width: 400px; //varies
    height: 55px;
    position:relative;    
}
.right {
    width:560px; //varies
    float: left;
    height: 55px;
    background-color:green; // will be background-image with width: 960px;
}

-

代码语言:javascript
运行
复制
<!-- Javascript -->
$('.scroll').scrollLeft(/*to position?*/);
EN

回答 1

Stack Overflow用户

回答已采纳

发布于 2012-02-10 21:22:47

在名为scollLeft的元素上有一个属性。它获取或设置元素内容向左滚动的像素数。

对于您的特定问题,如果您想使用jQuery,此代码片段可能会对您有所帮助:

代码语言:javascript
运行
复制
$('.scroll')[0].scrollLeft = $('.left').width()

这是一个jsFiddle example

票数 5
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/9227823

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档