javascript - .load() 带有外部网页的动画？

Question

这基本上是我想要做的：

我想用我的内容滑动（）一个 div。我想 .load() 那个 div 和 .slideDown() 那个 div 中的外部网页（在同一台服务器上）。

现在这是我所拥有的：

$(document).ready(function() {  
   $('a').click(function(){  
   $('.content').slideUp('1000');
   $('.content').hide().load('about.html');
   $(".content").slideDown('1000');
   });  
});

基本上这就是我得到的：div.content隐藏自己，加载about.html页面，然后出现。但没有slideUps 或slideDowns。

有人有想法吗？

抱歉，如果这是一个菜鸟问题，这是我第一次尝试 js/jquery。

提前致谢。

Answer 1

那是因为这些是异步操作。您必须在回调中继续执行：

$('a').click(function(){  
   $('.content').slideUp('1000', function() {
     this.hide().load('about.html', function() {
       this.slideDown('1000');
     });
   });
});

Answer 2

尝试这个

$(document).ready(function() {  
   $('a').click(function(){  
   $('.content').slideUp(1000);
   $('.content').hide().load('index2.html');
   $(".content").slideDown(1000);
   });  
});

干杯:)

Answer 3

您将字符串 '1000' 传递给 slideUp 或 slideDown。它应该是数字或字符串，它可以像“慢”一样......

Answer 4

尝试：

$('a').click(function(){  
   var el = $('.content'),                      //cache content to avoid multiple calls
       slidetime = 1000;                        
   el.slideUp(slidetime,function(){             //slide up
       el.hide().load('about.html',function(){  //afterwards, load
           el.slideDown(slidetime);             //afterwards, slide
       });
   });
});