0

次の問題。ここにあるシンプルなjqueryプラグインを使用しています が、これまでのところ問題なく動作します。問題は、タッチデバイス（ipad2など）でテストすると、div内でスクロールできないことです。2本指スワイプでも動かない！動作は「標準の」スクロールバーと同じではないと思います。しかし、これを触れられるようにする解決策はありますか?

私はテスト段階にいます。つまり、本体のコードは非常に単純です。

$(document).ready(function() {

function appenddiv() {
    var $scrolling = $('<div id="test" class="scrolling">A lot of text in here ...<div id="scroll2"><img src="../images/31670035.jpg"></div></div>');


$scrolling.appendTo($('#container')).scrollbar();

}

$('#scrollbar-link').on('click', function() {
    appenddiv();
});
});

<body>
<a href="#" id="scrollbar-link">Klick mich!</a>

<div id="container">
</div>
</body>

スクローラーをスワイプできるようにする「タッチ可能な」スクリプトのようなものが必要ですか?

ありがとう

4

2 に答える 2

2

:-) はい、これは明らかに問題です...

根本的な問題は次のとおりです:
カスタム スクロールバーを作成するには、DIV オーバーフローを作成する必要があります: hidden - sys スクロールバーを非表示にします。これで結構です。ただし、この時点からモバイル (iPad も) デバイスでは、DIV はスクロールできなくなります。オーバーフローを使用する場合は（のみ）になります：自動...これは論理的です-多かれ少なかれ。しかし、あなたは今抱えている頭痛の種に駆り立てられます :-)

したがって、この時点で選択を行う必要があります..

a) タッチ デバイスでカスタム スクロールバーを忘れてしまう - オーバーフローを自動のままにしておく
b) ドラッグ アンド ドロップ機能を手動で実装する -モバイルデバイスを検出した場合

バージョン b) はトリッキーです - 再び。「mousedown」イベントとして知られているイベントは、タッチスクリーンでは異なる動作をするためです。マウスダウンは 1 つだけではありません。実際、指で画面に触れてから別の指で画面に触れるなど、一連の「マウスダウン」が発生する可能性があります。タッチスクリーンでは、これはタッチです。 []配列...

絶対に理にかなっていますが、物事を複雑にします...

いずれにせよ、それほど複雑ではない解決策については知りません...誰かが知っているなら、私もそれについて知りたいです!! :-) NiceScrollbars ライブラリプロジェクト

に取り組んでいる間、多くのテストを行い、この問題 (および他の問題) に多大な努力を払いました... この問題についてより深く議論したい場合は、ここにいます! 助けようとします

于 2013-02-22T14:24:13.503 に答える