JQuery Slider и Toggle

Question

У меня есть слайд-шоу, расположенное по адресу staging.asla.org/sustainablesites/secondary.html, которое использует плагин easySlider plus, а также функцию jQuery Toggle.

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

Является ли это выполнимым?

Спасибо!

Answer 1

Я не рассматривал это подробно, но я чувствую, что, поскольку плагин есть, вы не можете.

Возможно, вам придется изменить свой плагин. Но во-первых, изменить код настройки, чтобы быть что-то вроде этого, передавая свой тизер в качестве опции:

var options = { 
     teaser: $("#slider li .block") 
    }; 

Нет, чтобы изменить плагин. Это почти работает, но, вероятно, может быть написано немного лучше.

$("#slider").easySlider(options); 

     $("a", "#" + options.nextId).click(function() { 
      if (options.teaser) { 
       options.teaser.slideToggle(); 
      } 
      animate("next"); 
      if (t >= ts) $(this).fadeOut(); 
      $("a", "#" + options.prevId).fadeIn(); 
      if (options.teaser) { 
       options.teaser.slideToggle(); 
      } 
     }); 

Вам также необходимо изменить для предыдущего.

Кроме того, чтобы сделать это лучше поместить следующие строки кода в функции:

  animate("next"); 
      if (t >= ts) $(this).fadeOut(); 
      $("a", "#" + options.prevId).fadeIn(); 
      if (options.teaser) { 
       options.teaser.slideToggle(); 
      } 

и вызвать его из анонимной функции в первом перек, что-то немного, как это:

  if (options.teaser) { 
       options.teaser.slideToggle(function(){myNewFunc();}); 
      } 
      else{ 
       myNewFunc(); 
      } 

вы, возможно, придется сделать что-то эквивалентное от FADEOUT()/FadeIn()

поиграйте посмотреть, что вы думаете.

Answer 2

Вы можете попробовать это ... это не так, но это работает. Добавьте его внутри $ (документ) .ready (функция() {

$("#nextBtn,#prevBtn").live('click',function(){ 
if ($('.block').css('display') != 'none') { 
    $(".block").slideToggle().slideToggle(); 
} 
}) 

Вместо того, что если заявление .. это может быть чище использовать:

if ($('.block').is(':visible')) {...}