JQuery UI API - эффекты переноса (Transfer Effect)
категория
использование
Описание: элемент контура к другому элементу.
transfer
| 参数 | 类型 | 描述 |
|---|---|---|
| className | String | 转移的元素将接收的参数化的 class 名称。 |
| to | String | jQuery 选择器，要转移到的元素。 |
При попытке визуализировать взаимодействие между двумя элементами очень полезно.
Перенесите элемент с самим собой, класс ui-effects-transfer , другие стили должны быть определены вами, например, добавить фон или границу.
примеров
Нажмите на зеленый элемент передать его другому элементу.
<! DOCTYPE HTML>
<HTML LANG = "EN">
<Head>
<Meta Charset = "UTF-8">
<Title> эффектов переноса (Transfer Effect) Demo </ title>
<Link отн = "таблица стилей" HREF = "// code.jquery.com/ui/1.10.4/themes/smoothness/jquery-ui.css">
<Style>
div.green {
ширина: 100px;
высота: 80px;
фон: зеленый;
границы: 1px сплошного черного цвета;
позиция: относительная;
}
div.red {
Маржа-топ: 10px;
ширина: 50px;
высота: 30px;
фон: красный;
границы: 1px сплошного черного цвета;
позиция: относительная;
}
.ui эффекты-передачи {
границы: 1px пунктирная черный;
}
</ Style>
<Script SRC = "// code.jquery.com/jquery-1.10.2.js"> </ скрипт>
<Script SRC = "// code.jquery.com/ui/1.10.4/jquery-ui.js"> </ скрипт>
</ Head>
<Body>
<Div класс = "зеленый"> </ DIV>
<Div класс = "красный"> </ DIV>
<Script>
$ ( "Див") .click (функция () {
вар я = 1 - $ ( "ДИВ") .index (это);
$ (Это) .effect ( "передача", {до: $ ( "ДИВ") .eq (я)}, 1000);
});
</ Script>
</ Body>
</ HTML>