1

在我的网站上,我使用了一些自定义构建的 jquery 插件和几个外部插件。

我遇到的问题只发生在 IE 中。在这个页面上,我有一个 KenBurns Jquery Slider 和一些 jquery 选项卡。这两个插件在 Chrome / Firefox 上都能正常工作。但是在 IE 上,当我在选项卡之间切换时(在 KenBurns 滑块下方),第一个选项卡保持打开状态并且不会隐藏。Ken Burns Slider 也会重新加载或似乎会自行重新加载。

有谁知道为什么会发生这种情况或愿意看看吗?

页面:http ://devsite80.clickdealer.co.uk/used-land-rover-range-rover-364746

我的标签代码:

(function($) {

jQuery(document).ready(function () {


// Generate Tabs
$(".tabContents").hide();
    $(".tabContents:first").show();

    $("#tabContaier ul li a").click(function(e){

        e.preventDefault();

        var activeTab = $(this).attr("href");
        $("#tabContaier ul li a").removeClass("active");
        $(this).addClass("active");
        $(".tabContents").hide();
        $(activeTab).fadeIn();
    });

// Fix Tabs for Mobile
$(window).resize(function(){
    console.log('resize called');
    var width = $(window).width();
    if(width <= 757){
           $('.tabContents').show();
     }
     else{
            $(".tabContents:first").show();
     }
})
.resize();//trigger the resize event on page load.

});

}(jQuery));

这是我正在调用的其他插件的链接:http: //devsite80.clickdealer.co.uk/js/jquery.config.js

如果您需要更多信息,请告诉我:-)

谢谢你们的帮助!

4

2 回答 2

1

你的问题是你绑定到window.resize。在 IE 中,当页面上的任何元素被调整大小时会触发 window.resize 事件。

文章听到更多讨论它: window.resize event 在 Internet Explorer 中触发

我不建议在调整大小时绑定。我不会使用隐藏和显示,而是将此功能移至 CSS 并使用 jQuery 切换您的类。这也将允许你设置 CSS 媒体查询来完成你需要的:

@media screen and (min-width: 757px) {
    #YOUR CONDITIONAL CSS HERE
}
于 2012-07-06T16:45:45.963 回答
0

我收到语法错误:

'position().left' is null or not an object在 jquery.themepunch.kenburn.min.js 的第 128 行,字符 644

此外,无论出于何种原因,resize 在错误发生之前在 IE 中被调用了 4 次。您可以在 IE 上按 F12 以访问开发人员工具,然后返回页面并刷新它以查看错误。当然,单击“脚本”选项卡。

仅供参考,刷新工具控制台只会清除缓存,但我认为它不会重新加载页面,您实际上必须重新选择 IE 窗口。

我应该补充一点,这些图像不会显示为我的缩略图,只是作为图像的垂直列表。最后,我在 WinXP 上使用 IE8 (8.0.6001.18702IC)。

于 2012-07-06T16:28:47.627 回答