幻燈片效果

Question

大家好我試圖隱藏和顯示我的模態窗口的內容的同時，

當我在右下角點擊，我隱藏電流id，並顯示下一個ID。

這工作很好，但我想ti做到這一點上的效果幻燈片。

，所以這是我的代碼，當我點擊右下角

$('#right').live('click', function(){ 
    var total=$('.elemento').length; 
    var siguiente= parseInt(actual) +1; 
    if (siguiente <= total){ 
     AlaDerecha(sig); 

    } 
}); 

和

function AlaDerecha(sig){ 
    previo = actual; 
    actual = sig; 
    $("[data-item ="+ previo + "]").hide("slide", { direction: "left" }, 1000); 
    $("[data-item ="+ actual + "]").show("slide", { direction: "right" }, 1000); 
} 

如果我erease（幻燈片...）上AlaDerecha功能這樣

function AlaDerecha(sig){ 
    previo = actual; 
    actual = sig; 
    $("[data-item ="+ previo + "]").hide(); 
    $("[data-item ="+ actual + "]").show(); 
} 

它工作正常，隱藏當前項目並顯示下一個，但如果我把幻燈片效果當前項目移動到左側，但沒有隱藏d下一個項目不顯示它。

任何想法！

感謝

Answer 1

的第一件事，不要使用.live()，因爲它是過時和跨瀏覽器產生不想要的結果。以這種方式更改代碼：

$('body').on('click', '#right', function(){ 
    var total=$('.elemento').length; 
    var siguiente= parseInt(actual) +1; 
    if (siguiente <= total){ 
     AlaDerecha(sig); 
    } 
}); 

爲了使幻燈片正常工作，請使用回調函數。

function AlaDerecha(sig){ 
    previo = actual; 
    actual = sig; 
    $("[data-item ="+ previo + "]").hide("slide", { direction: "left" }, 1000, function(){ 
     $("[data-item ="+ actual + "]").show("slide", { direction: "right" }, 1000); 
    }); 
}