jQuery bxSlider Расширенные настройки - PullRequest
Новая
       7

jQuery bxSlider Расширенные настройки

0 голосов
/ 10 сентября 2011

Я пытаюсь использовать jQuery bxSlider, чтобы добавить элементы на мои слайды.Я пытаюсь выяснить, как бы я использовал currentSlideHtmlObject, чтобы вернуть H1 внутри слайда, который оживляет.Вот мой код прямо сейчас.Анимация запускается на первом слайде, но я не могу запустить его при каждом переходе слайда.Я нашел параметр currentSlideHtmlObject для добавления в onAfterSlide: function (), но не знаю, как бы я использовал его для нацеливания на каждый h1 внутри слайда. 

$(function(){
     $(".sliderWrapper li").each(function(index) {
      $(this).addClass('slide' + index);
    });
     $(".sliderWrapper").bxSlider({
        mode: 'fade',
        speed:500,
        pause: 8000,
        auto:true,
        autoHover: true,
        onAfterSlide: function(){

            $(".sliderWrapper li h1").each(function(){
                 $(this).animate({
                    opacity: 0.4,
                    fontSize: "3em",
                  });
            });
        },
    });


}); 

<ul class="sliderWrapper">
  <li><img src="images/jetGuy.png"/>
    <h1>professionalism defined.</h1>
    <div class="popup">popup</div>
  </li>
  <li><img src="images/jet.png" />
    <h1>professionalism defined.</h1>
    <div class="popup">popup</div>
  </li>
  <li><img src="images/personal.png" />
    <h1>professionalism defined.</h1>
    <div class="popup">popup</div>
  </li>
</ul>

1 Ответ

2 голосов
/ 23 декабря 2011

использование - 

$(".sliderWrapper li:eq(currentSlide) h1").animate({
                opacity: 0.4,
                fontSize: "3em",
              });

Вместо - 

$(".sliderWrapper li h1").each(function(){
             $(this).animate({
                opacity: 0.4,
                fontSize: "3em",
              });
        });

в функции после слайда.

надеюсь, это поможет.

...