如何让divs当前滚动位置?

时间:2015-12-18 11:46:18

标签: javascript jquery scroll reactjs

我想知道div的滚动位置 我左右两个按钮,中间有一个可滚动的div,里面装有数据 如果右侧没有数据,我想禁用右侧的按钮,如果左侧没有更多数据,则禁用左侧的按钮。 为此,我想我需要知道当前的滚动位置。任何提高这一点的建议都会很棒。

 `    return <div className="row">
        <div ref="previous_column" onClick={this.shift_left} href="#" style={style_div}></div>
        <div className="table-container" ref="table_container"> 
            <div className="sliding-window">
                    {this.props.grocery_cart.delivery_slots.map(function(obj) {
                            return <div key={d}>
                                        <CalendarDetail values={d} ref="delivery_date"/>
                                    </div>
                    }.bind(this))}
             </div>
        </div>
        <div ref="next_column" href="#" onClick={this.shift_right} style={style_div} className="plr-slide"></div>
 </div>`

我刚刚添加了一些相关代码。

上一列和下一列是div(左右按钮)

表容器是一个固定的div,其内部的滑动窗口滑动。

2 个答案:

答案 0 :(得分:2)

你可以使用jQuery这样做:

//axis y position (or top position)
$('[ref="table_container"]').scrollTop()
//axis x position (or left position)
$('[ref="table_container"]').scrollLeft()

或仅使用javascript:

//axis y position (or top position)
document.querySelectorAll('[ref="table_container"]').scrollTop;
//axis x position (or left position)
document.querySelectorAll('[ref="table_container"]').scrollLeft;

您可以在此处详细了解。

  

Element.scrollLeft

     

Element.scrollLeft属性获取或设置元素内容向左滚动的像素数。

答案 1 :(得分:0)

您可以使用div.position();

然后做position.top