Question

我已经制作了第一个带有可选div的滑块包含名为.description的内容，我正在搜索如何在显示某个幻灯片后为div设置动画。我尝试了类似的东西

$(document).ready(function(){ 
    if($("#test").hasClass('flex-active-slide')){
        $(".description").fadeIn(2000);
    };

但它对我不起作用，有人能告诉我实现这个目标的正确方向吗？

Answer 1

jQuery .animate有一个回调，你可以使用它：

$(".slide1").animate({opacity:'show'},1000,function(){
   $(".description").fadeIn(2000);
});

祝你好运

Answer 2

您缺少就绪功能的右括号：

$(document).ready(function(){ 
    if($("#test").hasClass('flex-active-slide')){
        $(".description").fadeIn(2000);
    }
}; // this

Answer 3

我为此建立了一个小jsFiddle： - ）

你可以像这样使用setInterval：

window.setInterval(function() {
  // your code here
}, 800) // checks all 800ms

See this fiddle

Answer 4

我终于做到了xD我不知道它是否正常但是它按照我的意愿工作;）如果有人知道如何让它变得更容易（因为现在它设置在计时器上，而不是附在幻灯片上），请告诉我;）

$(function () {
 var $anchors = $('.description');
 (function _loop(idx) {
$anchors.removeClass('highlight').eq(idx).addClass('highlight');
setTimeout(function () {
  _loop((idx + 1) % $anchors.length);
}, 7000);
$('.description').fadeIn(2000);
}(0));
});

window.setInterval(function() {

if($('#test2.highlight')){

     $('.description').removeAttr('style');
      $('.description').fadeIn(2000);
    }    
}, 7000); // checks all 800ms

第二个div可见后，jquery显示div

4 个答案: