Справка по эффекту jQuery fadeOut / fadeIn. (Jsfiddle)

Question

У меня работает базовый скрипт для создания эффекта слайдера. У меня есть настройки для простого переключения элементов. Вместо того, чтобы просто переключаться, я собираюсь создать эффект fadeOut / fadeIn. Документация, которую я обнаружил, кажется, отличается для каждого сценария ... есть ли метод базового уровня или уровня для начинающих для добавления эффекта затухания в ранее существующий сценарий? Заранее спасибо.

jsfiddle: http://jsfiddle.net/williamwong/865gG/1/

Answer 1

Самый простой способ - использовать методы jquery fadeIn () и fadeOut () .

$('div').fadeIn();

Документация для этих методов ( fadeIn () , fadeOut () ) содержит отличные примеры.

EDIT

Вот как я бы изменил ваш код, чтобы использовать его:

var cycle = window.setInterval(next, 2000);

function next() {
    $('#slides .current').fadeOut(function(el) {
        $(this).removeClass('current').next().add('#slides :first').last().addClass('current').fadeIn()
        });
}

По сути, вы хотите подождать, пока fadeOut завершится, чтобы исчезнуть в следующем элементе. Кроме этого, ваш код почти такой же.

Обновлена ​​вилка вашей скрипки - http://jsfiddle.net/9BQTH/2/

Answer 2

Я предполагаю, что вы можете использовать функции animate (), hide (), show (), используя свойство opacity.