web-dev-qa-db-ja.com

fadeIn効果を​​持つjQuery .load（）

AJAXを使用して、URLの#contentを#primary内でjQueryを使用してロードしようとしています。ロードしますがフェードインしません。何が間違っていますか？

$('.menu a').live('click', function(event) {
        var link = $(this).attr('href');
        $('#content').fadeOut('slow', function(){
            $('#primary').load(link+' #content', function(){
                $('#content').fadeIn('slow');
            });
        });
        return false;
    });

助けてくれて本当にありがとうございます。

jqueryloadfadein
25
Gab

実際に、代わりにラッパーdivにエフェクトを適用することでそれを行うことができました...

$('#primary').fadeOut('slow', function(){
    $('#primary').load(link+' #content', function(){
        $('#primary').fadeIn('slow');
    });
});
34
Gab

これだけ：

$('.element').load('file.html',function(){}).hide().fadeIn();

または、load（）関数でこの動作をデフォルトとして追加するには：

$.fn.load_=$.fn.load;
$.fn.load=function(){
    return $.fn.load_.apply(this,arguments).hide().fadeIn();
}
9
Brynner Ferreira

このようなフェード効果で.load（）を使用することもできます

$("#container").fadeOut("slow").load('data.html').fadeIn('slow');

4
Vijaysinh Parmar

load()を使用する場合、jQueryはhtml()を内部的に使用して要素を更新します。つまり、要素のinnerHTMLプロパティを更新しているだけなので、アニメーションを適用することはできません。

代わりに、独自のAJAX新しいHTMLを取得するリクエストを記述し、それを要素に配置して、fadeIn()を呼び出す必要があります。

_$('.menu a').live('click', function(event) {
    var link = $(this).attr('href');

    $('#content').fadeOut('slow', function() {
        $.get(
            link +' #content', 
            function(data) {
                $("#primary").html(data).fadeIn('slow');
            }, 
            "html"
        );
    });
    return false;
});
_

ここではget()を使用しましたが、post()またはajax()を簡単に使用できます。

また、注意してください、live()は廃止されました。代わりにdelegate()を使用するか、jQuery 1.7+を使用している場合はon()を使用する必要があります。

3
Rory McCrossan

私はこのようなことをうまくやっていることがわかりました...

$（ '＃Div'）。fadeOut（0）.fadeIn（）。load（ 'foo.blah.html'）;

2
badsector

これは自然にフェードイン/フェードアウトするための最良の方法です。最初にコンテナを非表示にし、次にこのコンテナにページをロードします（ロードされますが非表示になります）。特殊効果。

$(".myClass").click(function () 
{
    $("#Container").hide();
    $("#Container").load("magasin.html");
    $("#Container").fadeIn(); 
});
0
Khan Laoji