如何使用javascript重置div中的滚动位置

Ana*_*Jha 5 html javascript css dojo

我正在研究移动混合应用程序.

在我的html页面中,我有3个标签.单击选项卡时,可滚动div的内容会发生变化.我的问题是当我向下滚动div(视图)的内容并单击另一个选项卡时,内容消失(但内容在那里).

所以,请帮助我,以便我可以在点击任何标签时重置位置.

请建议我只使用JavaScript或CSS,而不是使用JQuery,因为我没有使用JQuery库.

Sha*_*dow 16

没有看到代码,我可以猜测.如果要重置滚动位置,只需使用即可

window.scrollTo(0,0); 
Run Code Online (Sandbox Code Playgroud)

将此代码添加到每个选项卡单击功能,以便在您单击任何选项卡时,它将重置为顶部.

如果您有任何具有溢出属性的特定div

var myDiv = document.getElementById('specificDiv');
myDiv.scrollTop = 0;
Run Code Online (Sandbox Code Playgroud)

  • 设置scrollTop确实有效,但是如果你设置它时你的div是隐藏的,它似乎不起作用。取消隐藏后将scrollTop 设置为零。 (2认同)

Ham*_*ady 6

这很容易

 <div id="test" style="height:150px; width:600px;overflow-y:auto;background-color:gray;">
     <div style="width:150px;height:500px; background-color:green;"></div>
 </div>
Run Code Online (Sandbox Code Playgroud)
document.getElementById('test').scrollTop =0;
Run Code Online (Sandbox Code Playgroud)


Ana*_*Jha 5

最后这对我有用

function resetScrollPos(selector) {
  var divs = document.querySelectorAll(selector);
  for (var p = 0; p < divs.length; p++) {
    if (Boolean(divs[p].style.transform)) { //for IE(10) and firefox
      divs[p].style.transform = 'translate3d(0px, 0px, 0px)';
    } else { //for chrome and safari
      divs[p].style['-webkit-transform'] = 'translate3d(0px, 0px, 0px)';
    }
  }
}
resetScrollPos('.mblScrollableViewContainer');
Run Code Online (Sandbox Code Playgroud)

在视图之间转换后调用此函数将重置我的滚动位置。