jQuery UI API - .show()

Категория

Эффекты | Ядро эффектов | Переопределения методов | Методы

Использование

Описание:Отображает выбранные элементы с помощью пользовательского эффекта.

Возвращает:jQuery

.show( effect [, options ] [, duration ] [, complete ] )

Parameters Type Описание Default
effect String Строка, указывающая, какой эффект использовать.
options Object Настройки, специфичные для эффекта, иeasing。
duration Число или строка Строка или число, определяющее, как долго будет выполняться анимация. 400
complete Function() Функция, которая вызывается после завершения анимации.

.show( options )

Parameters Type Описание
options Object Все настройки анимации. Единственное обязательное свойство — effect.
  • effect
    Тип: String
    Описание: строка, указывающая, какой эффект использовать.
  • easing(По умолчанию:"swing"）
    Тип: String
    Описание: строка, указывающая функциюeasing, которую нужно использовать.
  • duration(По умолчанию:400）
    Тип: Number или String
    Описание: строка или число, определяющее, как долго будет выполняться анимация.
  • complete
    Тип: Function()
    Описание: функция, вызываемая после завершения анимации.
  • queue(По умолчанию:true）
    Тип: Boolean или String
    Описание: логическое значение, указывающее, помещать ли анимацию в очередь эффектов. Если false, анимация начнётся немедленно.Начиная с jQuery 1.7,параметр queue также принимает строку, и в этом случае анимация добавляется в очередь, представленную этой строкой.

Плагин расширяет встроенный.show()метод jQuery. Если jQuery UI не загружен, вызов.show()метод не завершится ошибкой напрямую, потому что метод существует в jQuery. Однако ожидаемое поведение не произойдет.

Примеры

Используйте эффект Fold, чтобы отобразить div.

<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title>.show() 演示</title>
  <link rel="stylesheet" href="//code.jquery.com/ui/1.10.4/themes/smoothness/jquery-ui.css">
  <style>
  div {
    display: none;
    width: 100px;
    height: 100px;
    background: #ccc;
    border: 1px solid #000;
  }
  </style>
  <script src="//code.jquery.com/jquery-1.10.2.js"></script>
  <script src="//code.jquery.com/ui/1.10.4/jquery-ui.js"></script>
</head>
<body>
 
<button>显示 div</button>
<div></div>
 
<script>
$( "button" ).click(function() {
  $( "div" ).show( "fold", 1000 );
});
</script>
 
</body>
</html>

Другие расширения