0

HTML Webページでスクロールを使用していますが、問題はページ全体で機能することですが、スクロール機能を呼び出しているdivで機能させたいのは私のコードです

<script>
var startPos;

function init(){
  var scrollArea = document.getElementById('holder');
  scrollArea.addEventListener('touchstart', function(event){
    touchstartHandler(event);
  }, false);

  scrollArea.addEventListener('touchmove', function(event){
    touchmoveHandler(event);
  }, false);

  scrollArea.addEventListener('touchend', function(event){
    touchendHandler(event);
  }, false);
}

function touchstartHandler(e){
  startPos = e.touches[0].pageY;
}

function touchmoveHandler(e){
  var touch = e.touches[0];
  var targetBox = e.currentTarget.getElementsByTagName("div")[0];
  e.preventDefault();

  var fingerMoved = startPos - touch.pageY;
  startPos = touch.pageY;

  targetBox.scrollTop = targetBox.scrollTop + fingerMoved;
}
</script>
4

1 に答える 1

0

簡単な解決策は、ページ全体のスクロールをカットすることです。

CSS を設定します。

html, body{overflow:hidden;}
/* or */
html, body{overflow-y: hidden;}

これにより、ページのスクロールが完全になくなります。次に、スクロールするページ上の要素をスクロールに設定するだけです。正直なところ、JavaScriptは必要ありませんが、JavaScriptの方が優れた機能を提供します。

于 2013-08-27T22:22:55.230 に答える