jQuery的節目格形成另一頁

Question

我有這個問題，我覺得這有點難以解釋，但我會嘗試：

我有淡入和淡出一些divs從其他頁面與load()功能上採取了頁點擊事件。其中一個divs包含一系列使用Jquery.Cycle顯示的圖片。雖然在頁面本身jquery.Cycle工作正常，但當導入到頁面時，它不會。希望我的解釋清楚。

導入的代碼是這樣的：

$('#wrapper a').live("click", function(evt) { 

    evt.preventDefault(); 

    var url = $(this).attr('href'); 
    var oldDiv = $('#wrapper-content'); 
    var newDiv = $('#wrapper-content1').load(url + ' #wrapper-content'); 
    newDiv.hide(); 
    $('#wrapper-mid-in-right').prepend(newDiv); 
    newDiv.fadeIn(1000); 
    oldDiv.fadeOut(1000,function() { 

    $(this).remove(); 
    }); 

}); 

正如所說的週期的影響工程確定在頁面上。請幫幫我。 F.

$('#gallery').cycle({ 
fx: 'scrollRight', 
timeout: 100000, 
speed: 500, 
delay: -2000, 
pager: '#pager' 

}）;

Answer 1

我相信你的問題與你發佈的代碼塊無關。該插件在網頁作品因爲一些事情本身：

1. 週期插件加載
2. 標記已經存在
3. 插件適當啓動（$(document).ready()等）

將此內容動態加載到頁面中時，這些事實可能都不是真實的。

1. 循環插件是否在本頁面中加載？
2. 您必須在導入新標記後啓動Cycle插件。

的JS在父頁面（加載循環內容的頁面）應該是大致一樣：

$('#wrapper-content1').load(url + ' #wrapper-content', function() { 
    $('#gallery').cycle({ 
     fx: 'scrollRight', 
     timeout: 100000, 
     speed: 500, 
     delay: -2000, 
     pager: '#pager' 
    }); 
}); 

Answer 2

嘗試更改如下，我希望它會幫助你。我寫了關於代碼旁邊更改的評論

function cycleFunction(){ 
// implement cycle functionality here 
} 

$(document).ready(function(){ 
    cycleFunction(); // calling function for 1st time 

    $('#wrapper a').on("click", function(evt) {  
    evt.preventDefault(); 

    var url = $(this).attr('href'); 
    var oldDiv = $('#wrapper-content'); 
    var newDiv = $('<div>').attr('id','wrapper-content1'); // create the div with id 
    $('#wrapper-mid-in-right').prepend(newDiv); include in the existing div 
    $('#wrapper-content1').load(url + ' #wrapper-content', function(){ 
     cycleFunction(); // calling function everytime div load 
    }); // load the new div 
    });  
}); 

Answer 3

嘗試這樣

$('#wrapper a').live("click", function(evt) { 

    evt.preventDefault(); 

    var url = $(this).attr('href'); 
    var oldDiv = $('#wrapper-content'); 
    var newDiv = $('#wrapper-content1').load(url + ' #wrapper-content'); 
    newDiv.hide(); 
    $('#wrapper-mid-in-right').prepend(newDiv); 
    newDiv.fadeIn(1000); 
    oldDiv.fadeOut(1000,function() { 

    $(this).remove(); 
    }); 


    $('#gallery').cycle({ 
     fx: 'scrollRight', 
     timeout: 100000, 
     speed: 500, 
     delay: -2000, 
     pager: '#pager' 

    }); 

});