javascript - Jquery 仅适用于 IE(高级 slider )

Question

有人可以帮助我获得this slider为 IE 工作。

我收到一条错误消息(仅在 IE 版本上)，指出 jquery 文件第 1 行第 1 列的 this file 中存在错误消息.

现在，我检查了其他已购买的脚本，它们可以在 IE 上运行。但是，我的只是不断崩溃。当我按照文档中的所有说明进行操作时，有人能告诉我它有什么问题吗？ (适用于 Firefox、Chrome、Safari、Opera)

Answer 1

这并不完全是一个答案，而更像是一个有根据的猜测。

如果您确实可以在某个地方访问 IE9，则可以将文档模式设置为 IE8 或 IE7，然后在“脚本”选项卡下应该有一个“开始调试”按钮。当设置为 IE8 或 IE7 时，将突出显示一条语句 d[f]=c ，您可以通过 settinc watch 查看 d是 DispHTMLStyle (某些 DOM 节点的样式对象(如 div 或其他东西)，f 是 String width，而 c 是 Number，值为 NaN(“非数字”的缩写) “)。您还有一个调用堆栈，在其中我看到(重新格式化)

jQuery(document).ready(function ($) {
    $('#my-slider').advancedSlider({
        width: '100%',
        height: 225,
        skin: 'minimal-small',
        slideButtonsNumber: true,
        effectType: 'scale',
        slicePattern: 'topToBottom',
        sliceDuration: 9000,
        timerAnimationControls: false,
        slideLoop: true,
        slideArrows: false,
        overrideTransition: true,
        shadow: false,
        timerAnimation: false,
        keyboardNavigation: true,
        pauseSlideshowOnHover: true,
        lightbox: false,
        thumbnailLightboxIcon: false,
        preloadNearbyImages: true,
        allowScaleUp: true,
        captionBackgroundOpacity: 0.90,
        slideProperties: {
            0: {
                captionPosition: 'custom',
                captionShowEffect: 'slide',
                captionHeight: 170,
                captionTop: 29,
                captionLeft: 630,
                slideshowDelay: 25000,
                captionBackgroundColor: '#ffffff'
            },
            1: {
                captionPosition: 'custom',
                captionShowEffect: 'slide',
                captionHeight: 170,
                captionTop: 29,
                captionLeft: 630,
                slideshowDelay: 10000,
                captionBackgroundColor: '#ffffff'
            }
        }
    });
});


//@ sourceURL=/inline-13b6e3cdf71.js

请注意，您已在文档中准备好此设置! CSS 可能还没有加载!

我怀疑将宽度设置为实际数值可能会解决您的问题。

在加载所有样式规则之前，通常不能保证 html 页面上的任何内容都具有宽度。甚至内联样式也可以被否决。因此使用 width的 100%可能是荒谬的。我认为这完全取决于您的浏览器如何解释该值。

您也可以尝试将其从文档中移出 ready窗口处理程序 load处理程序，看看会发生什么。通过这样做，您还可以获得手动触发一些 jQuery 以获取某个对象的宽度并使用该值(如果您想保持对样式规则的依赖)的能力。当然，缺点是您可能会在 slider 加载之前显示一些不需要的内容或一些其他工件。

所以，长话短说，通过手动为该宽度编码一个固定值来尝试它，然后从那里决定。

编辑:好的，对不起，没有用。我可以清楚地看到来源不同，但它也是同一种错误(语句 d[f]=c 与以前的对象/值相同。)

进一步检查，在调用堆栈中，我们有这条语句 c.css("width",parseInt(c.data("width"))); .局部变量 c似乎是一个 jQuery 对象，其中包含一个带有“滑动按钮”类的单个 div。我似乎记得前面提到的声明，但没有像我需要的那样深入研究它。所以我的第二个猜测是它与他们有关(不知何故)。

我也搜了一圈发现 http://codecanyon.net/item/advanced-slider-jquery-xml-slider/132618 ，我将假设您正在使用的是什么，虽然我没有看到任何明确的文档(我想这对于按使用付费的插件是有意义的)，但我确实在评论部分看到人们使用像 width: '100%' 这样的值没有投诉和演示 http://bqworks.com/products/advanced-slider/responsive.html确实在 IE8 浏览器模式下运行 jQuery(document).ready(...)初始化 slider ......所以几乎击落了我以前的所有其他理论(对不起!)。但我确实认为滑动按钮需要宽度。来自 c.css("width",...) 的“美化”代码行如下(关于我认为正在发生的事情的注释):

c = M.find(".slide-buttons");  //jquery find under M something with class slide buttons
//if the element doesn't have "width data"
//grab values from the style rules using jQuery .css http://api.jquery.com/css/
if (!c.data("width"))
{
    c.data("width", parseInt(c.css("width")));
    c.data("height", parseInt(c.css("height")))
}
//find other things (odd, why is there no period?)
d = c.find("buttons-middle");
f = d.find("buttons-inner");
//directly assign back those same values possibly obtained earlier 
c.css("width", parseInt(c.data("width")));
c.css("height", parseInt(c.data("height")));

当调用该代码时，c.css("width") 返回“auto”，这显然不能作为数字解析。当然，问题变成了，为什么 IE8 及以下版本会返回类似“auto”之类的东西，而其他浏览器却没有？答案可能是“这正是旧 IE 版本在那种情况下所做的。”。

我还注意到该演示也不使用 slider 按钮，因此您可能正在使用此小部件的开发人员在您获得此小部件的源代码文件时可能没有找到并发布干净解决方案的场景。

因此，如果您不想阅读我刚刚添加的所有内容，您可以尝试添加一个 CSS 规则，例如

.advanced-slider .slide-buttons {
    width: 400px;
}

或任何可行的方法。