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 回答