ここの最初のページで問題を簡単に見ることができます：http：//m.vancouverislandlife.com/
下にスクロール（上にスライド）して、コンテンツがページを離れることを許可します。コンテンツが跳ね返ることはなく、永久に失われます。ただし、コンテンツがページにあふれ、スクロール可能であると想定されるページでは、スクロールは正しく機能します（この例については、[宿泊施設]> [b＆b]を参照し、下にスクロールしてください）。
私のコンピューターでは、最初のページのスクロールが常にで止まっていることに気づきました-899px。この問題を経験した人を他に見つけることができず、何をしようとしても、それを修正することはできません！ヘルプ！
（ただし、iPhoneやiPod Touchのターゲットオーディエンスは、画面のスペースが非常に少ないため、これによる影響を受けないため、必ずしも緊急ではありません。）
さて、新しい問題。iScrollの問題を解決するために、カスタムスクリプトを作成しました。ただし、実際のデバイスでは正しく機能していません。デスクトップブラウザでは、問題なく動作します。モバイルでは、時々トップに戻って、いくつかのタッチを認識しません。これはおそらく、デフォルトのイベントをキャンセルし、少しハックする必要があったためです。どうすればこれを修正できますか？（うん-+500の賞金の単純な問題。悪くないね？）
スクリプトは次のとおりです。Webサイトは通常の場所にあります。
function Scroller(content) {
function range(variable, min, max) {
if(variable < min) return min > max ? max : min;
if(variable > max) return max;
return variable;
}
function getFirstElementChild(element) {
element = element.firstChild;
while(element && element.nodeType !== 1) {
element = element.nextSibling;
}
return element;
}
var isScrolling = false;
var mouseY = 0;
var cScroll = 0;
var momentum = 0;
if("createTouch" in document) {
content.addEventListener('touchstart', function(evt) {
isScrolling = true;
mouseY = evt.pageY;
evt.preventDefault();
}, false);
content.addEventListener('touchmove', function(evt) {
if(isScrolling) {
evt = evt.touches[0];
var dY = evt.pageY - mouseY;
mouseY = evt.pageY;
cScroll += dY;
momentum = range(momentum + dY * Scroller.ACCELERATION, -Scroller.MAX_MOMENTUM, Scroller.MAX_MOMENTUM);
var firstElementChild = getFirstElementChild(content);
content.style.WebkitTransform = 'translateY(' + range(cScroll, -(firstElementChild.scrollHeight - content.offsetHeight), 0).toString() + 'px)';
}
}, false);
window.addEventListener('touchend', function(evt) {
isScrolling = false;
}, false);
} else {
content.addEventListener('mousedown', function(evt) {
isScrolling = true;
mouseY = evt.pageY;
}, false);
content.addEventListener('mousemove', function(evt) {
if(isScrolling) {
var dY = evt.pageY - mouseY;
mouseY = evt.pageY;
cScroll += dY;
momentum = range(momentum + dY * Scroller.ACCELERATION, -Scroller.MAX_MOMENTUM, Scroller.MAX_MOMENTUM);
var firstElementChild = getFirstElementChild(content);
content.style.WebkitTransform = 'translateY(' + range(cScroll, -(firstElementChild.scrollHeight - content.offsetHeight), 0).toString() + 'px)';
}
}, false);
window.addEventListener('mouseup', function(evt) {
isScrolling = false;
}, false);
}
function scrollToTop() {
cScroll = 0;
content.style.WebkitTransform = '';
}
function performAnimations() {
if(!isScrolling) {
var firstElementChild = getFirstElementChild(content);
cScroll = range(cScroll + momentum, -(firstElementChild.scrollHeight - content.offsetHeight), 0);
content.style.WebkitTransform = 'translateY(' + range(cScroll, -(firstElementChild.scrollHeight - content.offsetHeight), 0).toString() + 'px)';
momentum *= Scroller.FRICTION;
}
}
return {
scrollToTop: scrollToTop,
animationId: setInterval(performAnimations, 33)
}
}
Scroller.MAX_MOMENTUM = 100;
Scroller.ACCELERATION = 1;
Scroller.FRICTION = 0.8;