加載後jQuery ajax滑動

我有一個縮略圖網格，每個鏈接到它自己的帖子頁面。點擊後，下面的一個容器div滑落並用ajax加載內容。加載後jQuery ajax滑動

問題：當我第一次點擊一個縮略圖時，它不會順利滑下。內容剛剛出現。但是，當我在另一個縮略圖上再次單擊時，容器會順利滑入並滑入新內容。看起來它第一次沒有滑下來的原因是因爲當調用滑動窗口時div容器仍然是空的。

我該如何解決這個問題？如果我爲div設置了一個固定的高度，那麼它可以很好地工作，但我需要根據每個拉動的頁面調整高度。

非常感謝！

代碼：

var hash = window.location.hash.substr(1); 
var href = $('.work-item a').each(function(){ 
    var href = $(this).attr('href'); 
    if(hash==href.substr(0,href.length-5)){ 
     var toLoad = hash+'.html #content-post > *'; 
     $('#content').load(toLoad) 
    }           
}); 

$('.work-item-hover').click(function(){ 

    var toLoad = $(this).attr('href')+' #content-post > *'; 
    $('#content-post').slideUp('normal',loadContent); 
    $('#load').remove(); 
    $('.content-post-wrap').append('<span id="load">LOADING...</span>'); 
    $('#load').fadeIn('normal'); 
    window.location.hash = $(this).attr('href').substr(0,$(this).attr('href').length-5); 
    function loadContent() { 
     $('#content-post').load(toLoad,'',showNewContent()) 
    } 
    function showNewContent() { 
     $('#content-post').slideDown('slow',hideLoader()); 
    } 
    function hideLoader() { 
     $('#load').fadeOut('normal'); 
    } 
    return false; 
});

來源

2013-06-01 beliy333

你可以創建Ajax加載與.ajaxComplete（）方法的內容後滑動。類似這樣的：

$(document).ajaxComplete(function(){ 
    $('#content-post').slideDown('slow',hideLoader()); 
});

來源

2013-06-01 01:53:51

謝謝！作品！沿着相同的主題...我如何選擇和應用函數到這個Ajax加載的元素？如果我做標準 '$（文件）。就緒（函數（）{ \t $（）的CSS（ '顯示 ' '無'）' 滑塊。';} ）' 一點也沒有」 t影響選定的對象... – beliy333

我認爲你應該在相同的ajaxComplete方法中應用該函數，因爲當你使用的方法在文檔加載完成時調用，而不是在ajax方法完成時調用。 @ user1389082 –

加載後jQuery ajax滑動

回答

相關問題