Смена класса - PullRequest
       17

Смена класса

0 голосов
/ 05 марта 2011

Я использую что-нибудь для слайда, и я хотел бы добавить к нему дополнительную функцию,

В основном по навигации я хотел бы иметь возможность изменить класс CSS для пункта меню,

Поэтому, если вы щелкнете по пункту меню 1, он также изменит класс css для div с помощью функции addclass, при щелчке он перемещает ползунок и также меняет класс div.

Я все еще учусь jquery, и я просто еще не понял, надеюсь, кто-нибудь из вас сможет мне помочь?

1 Ответ

0 голосов
/ 06 марта 2011

Непонятно, что именно вы хотите сделать, но вы можете добавить обратный вызов, чтобы добавить нужный класс.

Если вы не знали, к текущей навигационной ссылке добавлен класс cur. Вы можете просто использовать этот класс, чтобы сделать ваш дополнительный стиль.

Этот код добавит «текущий» класс к <li>, окружающему ссылку:

$('#slider').anythingSlider({
  onSlideComplete : function(slider){
    slider.$nav  // UL of the navigation list
      .find('li').removeClass('current')
      .find('.cur').parent().addClass('current');
  }
});

так что ваш HTML будет выглядеть примерно так:

<ul class="thumbNav"> <!-- this is the slider.$nav -->
  <li class="first">
    <a href="#" class="panel1">1</a>
  </li>
  <li class="current"> <!-- this is the current panel -->
    <a href="#" class="panel2 cur">2</a>
  </li>
  <li>
    <a href="#" class="panel3">3</a>
  </li>
  <li>
    <a href="#" class="panel4">4</a>
  </li>
  <li>
    <a href="#" class="panel5">5</a>
  </li>
  <li class="last">
    <a href="#" class="panel6">6</a>
  </li>
</ul>

Обновление: хорошо, попробуйте это ... и вот демо

HTML

<div id="background" class="bg1"></div>

Сценарий

$('#slider').anythingSlider({
    onSlideComplete: function(slider){
        // get text, or you could use index()
        var bg = $.trim( slider.$nav.find('.cur').text() );
        // replace entire class
        $('#background').attr('class', 'bg' + bg);
    }
});
...