Question

我正在尝试使用jQuery加载函数将html页面加载到元素中。问题是当新内容加载时，我会得到一个小的闪烁。

您可以在此处查看演示页面 - http://wwwdev.legendboats.com（点击底部小船将新内容加载到主区域）

以下是我目前正在使用的代码。

$("#mycarousel a").click(function() {

     $("#home_box div").fadeOut().load($(this).attr("href") + ' #featured_content', function(response, status, xhr) {
        $(this).fadeIn();
    });

    return false;
});

Answer 1

flickr仅在从缓存加载内容时发生，因为在旧内容淡出之前，load（）方法在新内容中淡入淡出，尝试在淡出的回调函数中加载内容。

$("#mycarousel a").click(function() 
{
     $("#home_box div").fadeOut(function() 
     {
         $(this).load($(this).attr("href") + ' #featured_content', function(response, status, xhr) 
         {
             $(this).fadeIn();
         }
     });

    return false;
});

Answer 2

尝试将加载延迟到褪色之后：

$("#mycarousel a").click(function() {
  var url = $(this).attr('href');
  $("#home_box div").fadeOut('slow', function() {
    $(this).load(url + ' #featured_content', function(response, status, xhr) {
      $(this).fadeIn();
    });
  });
});

编辑 - 修复了“此”混淆的问题

使用jade load和fadeIn技术

2 个答案: