0

我有以下代码：

<div id="slideshow" >
    <div class="check">
        <img src="images/slideshow/image01.jpg" alt="Slideshow Image 1" />
    <p>Some paragraph</p>
    </div>    
    <div>
        <img src="images/slideshow/image02.jpg" alt="Slideshow Image 2" />
        <p>Some paragraph</p>
    </div>
    <div>
        <img src="images/slideshow/image03.jpg" alt="Slideshow Image 3" />
        <p>Some paragraph</p>
    </div>
</div>

我发现这个幻灯片方法使用以下代码淡入和淡出 DIV 以创建一种图像幻灯片：

function slideSwitch() {

var $active = $('#slideshow DIV.check');

if ( $active.length == 0 ) $active = $('#slideshow DIV:last');

var $next =  $active.next().length ? $active.next()
    : $('#slideshow DIV:first');

$active.addClass('last-active');

$next.delay(2000)
    .css({opacity: 0.0})
    .addClass('check')
    .animate({opacity: 1.0}, 1000, function() {
        $active.removeClass('check last-active');
    });
}

$(function() {setInterval("slideSwitch()", 8000);});

如您所见，它添加了在 DIV 中淡出的“检查”类。当slideSwitch 函数将类“检查”添加到Div 时，我正在尝试使用Jquery 检查，然后执行某些操作。我试过这个，但它不起作用：

if ($("#slideshow > div:nth-child(2)").hasClass('check')) {
    $("#slideshow > div:nth-child(2)").animate({marginTop: "-50px"}, 5000);
} else {
//Do nothing
}

如果我只是检查第一个孩子或者我只是添加它（可能是因为它已经在 HTML 代码中定义了类），它就可以工作：

if ($("#slideshow DIV").hasClass... etc

但是随后动画立即开始，当我真正想要的是它在第二个 DIV 已经在 J​​avaScript 中分配了类“检查”之后立即开始。请帮忙！！！！！

4

1 回答 1

1

在上面的代码中调用该类时会立即添加该类。为什么不包括你的动画呢？

$next.delay(2000)
    .css({opacity: 0.0})
    .addClass('check')
    .animate({opacity: 1.0}, 1000, function() {
        $active.removeClass('check last-active');
        $("#slideshow > div:nth-child(2)").animate({marginTop: "-50px"}, 5000);

    });
}
于 2012-05-07T15:00:14.093 回答