0

我通过 codecanyon.net 购买了一些文件，它们在所有浏览器上都运行良好。就在最近我注意到他们没有在 Chrome 中工作。

代码真的很大，我试图通过对 js 文件的反复试验来改变一些东西，但没有成功。您可以在http://miguelsart.com/scroller-test看到滑块。

如您所见，字幕应该是隐藏的，一旦您将鼠标悬停，它们就会向上滑动。但是在 Chrome 中，字幕会自动出现，当你悬停时什么也不会发生。

我认为这部分代码有问题：

//init captions
Scroller.prototype.initCaptions = function() {
    var $captions = this._$slides.find(">p:first");
    if (this._displayCaption) {
        var padding = $captions.outerWidth() - $captions.width();
        $captions.css({width:this._slideWidth - padding, display:"inline-block"}).click(preventDefault);
        if (this._captionPos == OUTSIDE) {
            var heights = $captions.map(function() { return $(this).height(); }).get();
            var maxHeight = Math.max.apply(Math, heights);                  
            $captions.css({top:this._captionAlign == TOP ? 0 : this._slideHeight, height:maxHeight});

            this._extHeight = $captions.outerHeight();                  
            if (this._captionAlign == TOP) {
                this._extOffset = this._extHeight;
            }
            $captions.addClass("outside");
        }
        else {
            if (jQuery.browser.msie && parseInt(jQuery.browser.version) > 6 && parseInt(jQuery.browser.version) < 9) {
                $captions.addClass("ie-inside");
            }
            else {
                $captions.addClass("inside");
            }
        }                   
    }
    else {
        $captions.hide();
    }
}

我尝试过更换显示器以提高不透明度或可见性，但没有任何效果。有谁知道可能出了什么问题？

提前致谢！

4

1 回答 1

1

我相信我已经弄清楚作者的实现出了什么问题，你是对的，它与最新版本的 Chrome 有关。

在 jquery.wt.scroller.js 的第 43 行

this._mouseoverCaption = window.Touch ? false : opts.mouseover_caption;

该插件的作者正在测试原生触摸功能（通过确定是否window.Touch已定义）。Chrome 最近一定在最近的版本中添加了原生触控 API 功能。

所以作者的意思是说“你不能在触摸设备上悬停，所以我们不能在触摸设备上悬停时显示字幕，所以我们总是会显示它们”——这是合乎逻辑的。

然而，仅仅因为存在触摸功能并不意味着触摸输入是默认的（如本例所示）。Modernizr 通过执行以下条件来解决这个问题（目前）：

if(('ontouchstart' in window) || window.DocumentTouch && document instanceof DocumentTouch) {

有人告诉我，这也将很快被打破。（https://github.com/Modernizr/Modernizr/blob/master/feature-detects/touchevents.js#L42）

所以，长话短说（我知道为时已晚）将其添加到插件代码中：

将此添加到第 7 行（将所有行向下推一）：

var TOUCH = ('ontouchstart' in window) || window.DocumentTouch && document instanceof DocumentTouch;

在插件代码中查找并替换所有出现的window.Touchwith 。TOUCH

告诉插件的作者我会给他发账单。:)

于 2013-10-01T18:31:00.850 回答