触发活动类的操作

时间:2013-11-18 08:25:06

标签: jquery triggers slide

我为每张幻灯片制作了一个滑块和标题,说明。当幻灯片处于活动状态时,我想使用jquery为字幕设置动画。不知怎的,我设法做到了,但它不像我认为它应该完成;)这里是我做的代码,它的工作原理,但在计时器上,任何人都可以帮助我触发这个?

$(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

html

 <ul class="slides">

    <li id="test" class="" style="width: 100%; float: left; margin-right: -100%; position: relative; height: 460px; display: list-item; opacity: 0.42695848571879425;">

   <a href="http://tyf">

     <span id="test3" class="caption highlight" style="top: 63.088278221567435px;">test2</span>                             


                                                </a>
                        <img src="http://hurompolska.pl/wp-content/uploads/2013/11/przepisy_tlo.png" width="100%">                                                       <span id="test2" class="description highlight" style="display: inline; opacity: 0.24278023310924668;">opis2</span>                          </li>
                                        <li id="test" class="flex-active-slide" style="width: 100%; float: left; margin-right: -100%; position: relative; height: 460px; display: list-item; opacity: 0.5730415142812058;">

                                                <a href="http://bum">

                                                     <span id="test3" class="caption" style="top: 63.088278221567435px;">test</span>                            


                                                </a>
                        <img src="http://hurompolska.pl/wp-content/uploads/2013/11/top1.jpg" width="100%">                                                       <span id="test2" class="description" style="display: inline; opacity: 0.24278023310924668;">tesfasd</span>                          </li>

            </ul>

0 个答案:

没有答案