2

現在、 touchSliderを使用してスライダーに取り組んでいますが、 mouseTouch オプションは機能しません。スライダー自体は正常に機能しますが、mouseTouch オプションは機能しません。私は何を間違っていますか?

これが私のjsです:

$(document).ready(function() {
    $(".touchslider").touchSlider({ mouseTouch: true });
});

およびhtml:

        <div class="touchslider">
            <div class="touchslider-viewport" style="width:500px; height: 375px;overflow:hidden; border: 1px solid #f00;"><div>
                <div class="touchslider-item"><img src="img/3540115854_5d302001da.jpg" width="500" height="354" /></div>
                <div class="touchslider-item"><img src="img/3542680555_ea43d85e0a.jpg" width="500" height="354" /></div>
                <div class="touchslider-item"><img src="img/3540231388_f8ec22b549.jpg" width="500" height="354" /></div>
                <div class="touchslider-item"><img src="img/3546828250_6f91b64ba7.jpg" width="500" height="354" /></div>
            </div></div>

            <div>
                <span class="touchslider-prev">←&lt;/span>
                <span class="touchslider-nav-item touchslider-nav-item-current">1</span>
                <span class="touchslider-nav-item">2</span>
                <span class="touchslider-nav-item">3</span>
                <span class="touchslider-nav-item">4</span>
                <span class="touchslider-next">→&lt;/span>
            </div>
        </div>
4

1 に答える 1

1

ファイルプロトコルを使用してローカルファイルシステム経由で .html にアクセスすると、同じ問題が発生しました

file://pathtothehtml/touchslidertest.html

httpを使用して .html にアクセスすると、問題は発生しません。

http://hostnametothehtml/touchslidertest.html

MacOSでchrome、firefox、safariを使用しました-httpを使用すると、それらすべての問題が解決しました。

原因分析

ブラウザーは、http 経由で収集された結果とは異なるファイル プロトコルを使用して収集された結果を処理します。

注意: 一般的なブラウザがファイル プロトコルをどのように処理するかについては何もわかっていないため、以下は推測にすぎません。

ブラウザがファイル プロトコルのドラッグ アンド ドロップをサポートしている可能性があります。このサポートは、ブラウザーのページ インタープリターのイベント処理をオーバーライドする場合があります。つまり、画像のドラッグ イベントがページの DOM イベント処理ルーチンに到達しないようにします。

于 2013-02-14T10:22:44.260 に答える