如标题中所述,此页面最少的jQuery网站在Chrome和Firefox上却出现了疯狂的滞后,但在IE10上却没有 我的确意识到MS以10扩大了他们的比赛,但是为了甜蜜的主人,这有什么关系?

我读过,Chrome有时会在div hide()s和show()s上表现不佳,但是我使用的是fadeIn()和fadeOut(),似乎缺少了一些东西。

我为此创建了一个JSFiddle,以防万一我做错了什么。

http://jsfiddle.net/g2avityhitz/ZdqEd/1/

(function($){
    $(document).ready( function () {
        $("#picbox .tiny img").click( function () {
            $("#picbox .tiny img").removeClass('selected');
            $(this).addClass('selected');
            imgSrc = $(this).attr('src');
            $("#picbox .main").css({
                'background-image'  : 'url(' + imgSrc + ')'
            });
            $("#picbox .main a").attr('href',imgSrc);
        });

        $("#picbox .main a").click( function (e) {
            e.preventDefault();
            imgSrc = $(this).attr('href');
            $("#lightbox .frame img").remove();
            $("#lightbox .frame").append('<img src="' + imgSrc + '" />');
            $("#lightbox").fadeIn(500, function () {
                $('#lightbox .frame .close').click( function () {
                    $("#lightbox").fadeOut(200);
                });
            });
        });
    });
})(jQuery);

谢谢,麻烦您了。

编辑:大的反应,只是再次指出-无滞后于IE浏览器 ,仅适用于Chrome和Firefox。 这可能是什么呢?

===============>>#1 票数:2

这是一个可以优化您所拥有内容的缓存示例。

它会解决一切吗? 不确定,但是肯定会有所帮助。

缓存的代码:

var $images = $("#picbox .tiny img"),
    $main = $("#picbox .main"),
    $mainLinks = $main.find("a"),
    $lightbox = $("#lightbox"),
    $frame = $lightbox.find(".frame"),
    $frameImages = $frame.find("img");

    $images.on("click", function () 
    {
        var $this = $(this);

        $images.removeClass('selected');
        $this.addClass('selected');
        imgSrc = $this.attr('src');
        $main.css({ 'background-image': 'url(' + imgSrc + ')' });
        $mainLinks.attr('href', imgSrc);
    });

    $mainLinks.on("click", function (e) 
    {   
        e.preventDefault();

        imgSrc = $(this).attr('href');
        $frameImages.remove();
        $frame.append('<img src="' + imgSrc + '" />');
        $lightbox.fadeIn(500, function () 
        {
            $frame.find(".close").on("click", function () 
            {
                $lightbox.fadeOut(200);
            });     
        });
    }); 
});

  ask by Nigel M. translate from so

未解决问题?本站智能推荐: