Оглавление

.fadeIn(), .fadeOut(), и .fadeTo()

Для создания (путем изменения параметра непрозрачности) эффекта плавного появления или исчезновения элемента на экране используются соответственно методы . .fadeIn() и .fadeOut(). Эти методы изменяют значение параметра непрозрачности элементов либо от 0 до 1 (.fadeIn()), либо от 1 до 0 (.fadeOut()). При исчезновении элемента к нему применяется свойство  display:none;. При появлении элемента свойство  display:none; удаляется из элемента, если оно присутствует.

 
Оба метода принимают в качестве аргументов необязательный параметр, определяющий длительность анимации (по умолчанию — 400 миллисекунд), и функцию обратного вызова, которая запускается по завершении анимации. Также предусмотрены два строковых параметра для задания двух фиксированных значений длительности, "fast" и "slow", которые транслируются соответственно в значения 200 и 600 миллисекунд.

 
Чтобы создать эффект исчезновения формы, вывести сообщение, а затем создать эффект появления формы и вывести другое сообщение, используйте следующий код.

$("form")
    .fadeOut(1000, function(){
            console.log("Faded out!");
        })
    .fadeIn(1000, function(){
            console.log("Faded in!");
        });

 

Третий метод из этого семейства, .fadeTo(), позволяет указать минимальный уровень, до которого должно снизиться значение параметра непрозрачности. Этому методу требуются два параметра: длительность перехода и предельное значение параметра непрозрачности (число между 0 и 1). Кроме того, в качестве необязательного третьего параметра может передаваться функция обратного вызова.

 
Создайте эффект плавного уменьшения непрозрачности формы до 50 % и выведите сообщение, используя следующий код.
$("form")
    .fadeTo(1000, 0.5, function(){
            console.log("Непрозрачность снижена до 50%!");
        });

Комментарии принадлежат их авторам. Мы не несем ответственности за их содержание.
Отправитель Нити