Question

大家好，我试图隐藏并同时显示我的模态窗口的内容，

当我点击右下角时，我会隐藏当前的ID，并显示下一个ID。

这项工作很好，但是我想要对此做幻灯片。

所以当我点击右下角时，这是我的代码

$('#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);
}

如果我像这样在AlaDerecha函数上（幻灯片...）

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

它工作正常，隐藏当前项目并显示下一个，但如果我放置幻灯片效果，当前项目移动到左边但没有隐藏，下一个项目不显示它。

任何想法！

感谢

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);
    });
}

幻灯片对内容的影响

1 个答案: