0

////////////////////////

这对我来说真的是一个糟糕的方法。经过多次调整，我得出一个结论，最好一次加载所有外部元素 (html)，并且只在单击时应用淡入效果，而不是同时尝试加载外部页面。下面的方法没有产生平滑的淡入淡出效果，并在加载外部页面时导致延迟。

////////////////////////

我正在通过以下方式加载外部页面：

$('a').click(function() {
$('#result').load($(this).attr('href'));

return false;
});

我正在尝试使用 fadeIn 加载外部页面。

我看过其他答案，但没有一个对我有用。也许我没有正确理解答案或错误地应用它。到目前为止，我最大的努力（经过无数次尝试）是这样，但这首先会在 div #one 中消失，然后只是加载 #load。（我这样做是因为我知道我不能将淡入淡出效果应用于加载 div 本身。） 

$("a").click(function () {
$("#one:hidden:first").fadeIn("slow");
$('#load').load($(this).attr('href'));

return false;
});

我对 jQuery 很陌生，这对除了我以外的其他人来说可能是非常简单的事情。

我真的很感激任何帮助。谢谢。

//////////////////这里是标记////////////////

<a href="./test.html" class="link">Load Page 1</a>

<div id="one">

<div id="load">load here</div>


</div>

///////////////////////////////////////// ///////////

4

1 回答 1

1 
<a href="./test.html" class="link">Load Page 1</a>

<div id="one" class="slot">
  <div id="load">load here</div>
</div>

最初隐藏 div

.slot{
 display:none;
}

加载外部内容

   $(".link").click(function (e) {
     e.preventDefault();      
    var $urlToLoad = $(this).attr('href');  
    $('#load').load($urlToLoad, function(data){
        $("#one").fadeIn('slow');
    });      
});

演示

于 2013-03-13T19:43:23.887 回答