0

他在那里，我一直在尝试几个小时而不知道（我正在使用 Wordpress），很难知道 jQuery 有什么问题。Windows/Mac 中的 FF 和 Chrome 运行良好，IE 让我发疯。

我在标题中使用：

<!DOCTYPE html>

这是我正在做测试的网站：

http://newportal.no-ip.org/

这是我的 JS 代码：

     jQuery(document).ready(function() {

//Menu
    jQuery("ul.menu").superfish({
            delay       : 100,
            animation   : {opacity:'show',height:'show'},
            //speed     : 10,
            autoArrows  : true, 
            dropShadows : false
        });

//Popup FancyBox
jQuery('.fancybox-media').fancybox({
        maxWidth    : 800,
        maxHeight   : 600,
        fitToView   : false,
        width       : '70%',
        height      : '70%',
        autoSize    : false,
        closeClick  : false,
        openEffect  : 'none',
        closeEffect : 'none'
    });

jQuery('.fancybox').fancybox(); 

    var thumbnails = 'a:has(img)[hrefjQuery=".jpg"]';
    jQuery(thumbnails).addClass("fancybox").attr("rel","fancybox");


jQuery(".popup").fancybox({
         'width' : '75%',
         'height' : '75%',
         'autoScale' : false,
         'transitionIn' : 'none',
         'transitionOut' : 'none',
         'type' : 'iframe'
     });

//Expand
jQuery('div.moexpander').hide();
    jQuery('a.moexpander').click(function(){
        jQuery(this).parent().next('div.moexpander').slideToggle();
        return false;
    });  

//Slideshow Destacados, Create an array of titles
    var titles = jQuery('#cycle div.item').find("h3").map(function() { return jQuery(this).text(); });
    //Add an unordered list to contain the navigation
    //Invoke the cycle plugin on #cycle
    jQuery('#cycle').before('<ul id="pager" class="sprites bannerBg"></ul>').cycle({
        //Specify options
        fx      :'fade', //Name of transition effect
        speed   : 600,
        delay   : -1200,
        pause   :   1,
        pager   : '#pager',     //Selector for element to use as pager container
        pagerAnchorBuilder: function (index) {               //Build the pager
        return '<li><a href="#">' + titles[index] + '</a></li>';
    },
    updateActivePagerLink: function(pager, currSlideIndex) {
        jQuery(pager).find('li').removeClass('active').filter('li:eq('+currSlideIndex+')').addClass('active');
    }
    });
  jQuery('#cycle').hover(function() {
  jQuery('.pause').show();
  }, function() {
        jQuery('.pause').hide();
    });


//Slideshow Voluntariado
    jQuery('#cyclePopular').after('<div id="navPopular">') 
        .cycle({ 
    fx          : 'scrollHorz',
    speed       : 'fast',
    delay   : -1200,
    pause   :   1,  
    pager       : '#navPopular'
    });

//Slideshow Avisos
    jQuery('#cycleAvisos').cycle({ 
    fx          : 'scrollHorz',
    delay   : -4000,
    pause   :   1,
    prev:    '#prev',
    next:    '#next',
    pager       : '#navAvisos',
    after: onAfter
    });
//Make Avisos's Height auto-resizing    
    function onAfter(curr, next, opts, fwd) {
        var jQueryht = jQuery(this).height();

        //set the container's height to that of the current slide
        jQuery(this).parent().animate({height: jQueryht});
    }

//Make all the block clickable  
jQuery("#link").click(function(){
     window.location=jQuery(this).find("a").attr("href");
     return false;
});         

//Add CSS to Sidebar Pages
jQuery('#sidebar-pages').find("li").before("<span class='sprites bulletR left'></span>");



// Tabs
 jQuery.fn.easytabs = function(){
 //Default Action
 jQuery(this).find(".easytabs_content").hide(); //Hide all content
 jQuery(this).find("ul.easytabs li:first").addClass("active").show(); //Activate first tab
 jQuery(this).find(".easytabs_content:first").show(); //Show first tab content
 jQuery(this).find(".easytabs_content li a").before("<span class='sprites bulletR'></span>"); //Show bullets

 //On Click Event
 jQuery("ul.easytabs li").click(function() {
 jQuery(this).parent().parent().find("ul.easytabs li").removeClass("active"); //Remove any "active" class
 jQuery(this).addClass("active"); //Add "active" class to selected tab
 jQuery(this).parent().parent().find(".easytabs_content").hide(); //Hide all tab content
 var activeTab = jQuery(this).find("a").attr("href"); //Find the rel attribute value to identify the active tab + content
 jQuery(activeTab).fadeIn(); //Fade in the active content
 return false;
 });
};//end function

jQuery("div[class^='easytabs']").easytabs(); //Run function on any div with class name of "easytabs"

// Search animation with IE statements
    var input = jQuery('input#s');
    var divInput = jQuery('div.input');
    var width = divInput.width();
    var outerWidth = divInput.parent().width() - (divInput.outerWidth() - width) - 28;
    var submit = jQuery('#searchSubmit');
    var txt = input.val();

    input.bind('focus', function() {
        if(input.val() === txt) {
            input.val('');
        }
        jQuery(this).animate({color: '#000'}, 300); // text color
        jQuery(this).parent().animate({
            width: outerWidth + 'px',
            backgroundColor: '#fff', // background color
            paddingRight: '43px'
        }, 300, function() {
            if(!(input.val() === '' || input.val() === txt)) {
                if(!(jQuery.browser.msie && jQuery.browser.version < 9)) {
                    submit.fadeIn(300);
                } else {
                    submit.css({display: 'block'});
                }
            }
        }).addClass('focus');
    }).bind('blur', function() {
        jQuery(this).animate({color: '#b4bdc4'}, 300); // text color
        jQuery(this).parent().animate({
            width: width + 'px',
            backgroundColor: '#e8edf1', // background color
            paddingRight: '15px'
        }, 300, function() {
            if(input.val() === '') {
                input.val(txt)
            }
        }).removeClass('focus');
        if(!(jQuery.browser.msie && jQuery.browser.version < 9)) {
            submit.fadeOut(100);
        } else {
            submit.css({display: 'none'});
        }
    }).keyup(function() {
        if(input.val() === '') {
            if(!(jQuery.browser.msie && jQuery.browser.version < 9)) {
                submit.fadeOut(300);
            } else {
                submit.css({display: 'none'});
            }
        } else {
            if(!(jQuery.browser.msie && jQuery.browser.version < 9)) {
                submit.fadeIn(300);
            } else {
                submit.css({display: 'block'});
            }
        }
    });

});

我会非常感谢你的帮助，

H·

4

1 回答 1

1

我看到 IE 不太支持（或根本不支持）的两个方法调用：

  • .hover
  • .slideToggle

所有toggle功能都具有粗略/不一致的跨浏览器支持。我会尝试改变这一点，特别是因为slide效果实际上具有所有 jQuery 效果的最高开销，并且在慢速浏览器（如 IE - 尤其是旧版本）上显而易见。

至于.hover，我建议您阅读并使用.mouseenter、.mouseleave、.mousein和的组合.mouseout。我不记得哪个，但.hover实际上是其中两个的简写，但对它的支持很粗糙。其中一组是基于 IE 的内置设置，我不认为它.hover是简写的。


更新 1：

根据您的反馈，我建议您搜索.superFish和fancybox插件的源代码以确保它们不使用fadeTofor opacity，因为这将完全破坏您的脚本，并且它们使用与opacity兼容的正确操作技术IE。

更新 2：

你的.map()方法也是错误的。从您的其余代码中，我可以看到您正在尝试创建一个普通的 JavaScript 数组，而不是 jQuery 数组。因此，您必须调用.get()after .map()。我找到了另一个帖子的答案，进一步解释了这一点。

更新 3：

我希望我不是傻，但我注意到了这一行：

jQuery('div.moexpander').hide();

在为jQuery('div.moexpander'). 问题是，我在任何地方都看不到另一个电话来显示jQuery('div.moexpander')。如果我是正确的，并且之后您没有再次显示它，则该div.moexpander元素将永远不会显示，并且将永远不会使用处理程序。我不知道这对您的代码/问题有多重要，因为我仍然不知道您的症状，但这很可能是一个错误。

更新 4：

此外，只要我们正在调试，您应该运行代码并用分号终止每个函数声明。例如，更改：

function someFunct() { 
    ..... 
}

至

function someFunct() { 
    ..... 
};

尽管这在 JavaScript 中不是必需的，但在许多情况下这会影响/影响您的脚本，并且在某些情况下会使它们崩溃。

老实说，我不完全理解为什么会这样，但我遇到过这是问题的情况，我相信其中一些问题是在 IE 中。

更新 5：

如果这仍然不起作用，请查看jQuery 论坛上的此线程，该线程处理涉及 fancyBox 的 IE 加载问题。

于 2013-04-11T16:26:14.247 回答