Question

我制作了一个淡入淡出的动画。

我有两个按钮$('.point li')来显示两个不同的内容$("#"+classVal+" .table-cell")

但是，当我点击$('.point li')时，我想逐步从白色背景中显示其内容。

但是当我点击另一个按钮并单击返回时，它的不透明度仍然存在。

每次单击按钮时，有没有办法显示零不透明度的内容？

var q = $('#intro .table-cell'); //this is a first content to show
var qIndex;
$(window).ready(function(){
     $('.point li').click(function(){ //click a button
        $('.point li').removeClass('active');
        var classVal = $(this).attr('class');
        $(this).addClass('active');
        q.stop(true,false);
        $('.bg > div').css('display','none');
        $('.bg > div .table-cell').css('display','none');
        $('#'+classVal).css('display','block');
        q = $("#"+classVal+" .table-cell");
        qIndex = -1;
        showNextQ();
     });
 });
function showNextQ() {
    ++qIndex;
    q.eq(qIndex % q.length).show(2000).delay(1000).hide(2000, function(){ 
        showNextQ();
    });
}

Answer 1

我找到了解决方案。

动画属性保留的原因是JQuery将其存储到变量中。

所以我改变了函数“stop”中的第二个参数

q.stop(true,false);

到真

q.stop(true,true);

表示“跳到最后”

比它有效

jquery show hide无法正常工作

1 个答案: