Модификация Z-индекса при смене слоя (модификация плагина jquery)?

Question

Я использую следующий ротатор новостей плагина jquery для отображения нескольких заголовков новостей: http://landofcoder.com/index.php?option=com_jdownloads&Itemid=372&task=view.download&cid=9

Довольно приятный хедлайнер, но, похоже, он не изменяет z-index при переходе к различным слоям / историям, и, следовательно, видео, встроенное в слой 1, всегда активируется, даже если я нажимаю на новости или просматриваю другие видео. слои. Так, например, если я перейду к другой истории и нажму кнопку воспроизведения, видео на первой (самой верхней) истории активируется против той, на которой я сейчас.

Я надеялся на пример того, как изменить скрипт, чтобы облегчить также изменение z-index при изменении слоя / истории.

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

Answer 1

Хорошо, способ обойти белый экран - анимировать только текущий слой.Поэтому, когда вы хотите перейти к следующему слою, вы: 1. Установите для z-индекса текущего слоя большое число (скажем, 3) 2. Установите для z-индекса следующего слоя меньшее значение (скажем, 2).) и установите непрозрачность 1 3. Затухание только текущего слоя, и это откроет следующий слой ниже.4. Установите функцию обратного вызова в анимации текущего слоя, чтобы сбросить z-индексы до их правильных значений, чтобы не мешать следующему переходу.

, поэтому, адаптируя мое последнее предложение, я бы порекомендовал:

// accomodate your other issue
var $nextObj = $(this.slides).eq(index).css({zIndex:900, opacity:1});
$(currentObj).css({zIndex:1000}).stop().animate( {opacity:0}, {duration: this.settings.duration, easing:this.settings.easing}, function(){ $(this).css({zIndex: 1}); $nextObj.css({zIndex: 2}); );

Имеет ли это смысл?

Answer 2

Похоже, что не существует веб-сайта для этого скрипта, который бы демонстрировал или выставлял API (кажется, не имеет никакого API), так что это выстрел в темноте ... Вы должны быть в состоянии изменить строку 277 с помощью эти две строки:

$(currentObj).css({zIndex:2});
$(this.slides).eq(index).css({zIndex:3}).stop().animate( {opacity:1}, {duration: this.settings.duration, easing:this.settings.easing} );

Идея в том, что перед началом анимации вы просто устанавливаете правильный zIndex для видео.

Опять же, это снимок в темноте, потому что я предполагаю, что currentObj - это текущий отображаемый объект, а $ (this.slides) .eq (index) - следующий объект под ним.