jQuery UI API - .switchClass ()
categoria
Effetti speciali (Effetti) | Effetti core (Effetti Core) | Metodo sovraccarico (metodo override)
uso
Descrizione: Quando i cambiamenti di stile di animazione all'interno del set di elementi corrispondenti di aggiungere e rimuovere ogni elemento della classe specificata.
Restituisce: il jQuery
参数 | 类型 | 描述 | 默认值 |
---|---|---|---|
removeClassName | String | 要从每个匹配的元素的 class 属性中移除的一个或多个 class 名称,多个 class 名称用空格分隔 。 | |
addClassName | String | 要添加到每个匹配的元素的 class 属性中的一个或多个 class 名称,多个 class 名称用空格分隔。 | |
duration | Number 或 String | 一个字符串或一个数字,指定动画将运行多久。 | 400 |
easing | String | 一个字符串,指示要使用的 easing 函数。 | swing |
complete | Function() | 一旦动画完成时要调用的函数。 |
参数 | 类型 | 描述 |
---|---|---|
removeClassName | String | 要从每个匹配的元素的 class 属性中移除的一个或多个 class 名称,多个 class 名称用空格分隔 。 |
addClassName | String | 要添加到每个匹配的元素的 class 属性中的一个或多个 class 名称,多个 class 名称用空格分隔。 |
options | Object | 所有的动画设置。所有的属性是可选的。
|
.switchClass()
metodo che permette di transizioni animate, aggiungere classe durante la rimozione di Classe.
Transizione simile al CSS nativo, classe di animazione di jQuery UI fornisce una transizione graduale da uno stato ad un altro stato di transizione, garantendo nel contempo che tutti i dettagli del cambiamento di stile è fatto tramite CSS senza l'utilizzo di JavaScript. Tutte le animazioni di classe, che comprende .switchClass()
, consente la durata personalizzato dell'animazione e facilitando la funzione, l'animazione è completa fornisce anche un callback.
Non tutti gli stili possono essere animati da aggiungere. Ad esempio, l'immagine di sfondo animato. Non qualsiasi stile di animazione cambierà quando il film finisce.
Le estensioni plug-in jQuery costruiti metodo .switchClass (). Se jQuery UI non viene caricato, chiamare .switchClass()
metodo non si limita a fallire, perché il metodo esiste in jQuery. Ma non è il comportamento previsto.
Esempi
Aggiungere la classe "blu" per abbinare gli elementi e rimuovere la classe "grande" dagli elementi corrispondenti.
<! Html Doctype> <Html lang = "it"> <Head> <META charset = "utf-8"> <Title> .switchClass () Demo </ title> <Link rel = "stylesheet" href = "// code.jquery.com/ui/1.10.4/themes/smoothness/jquery-ui.css"> <Style> div { width: 100px; altezza: 100px; background-color: #ccc; } .big { width: 200px; height: 200px; } .blue { background-color: # 00F; } </ Style> <Src = "script // code.jquery.com/jquery-1.10.2.js"> </ script> <Src = "script // code.jquery.com/ui/1.10.4/jquery-ui.js"> </ script> </ Head> <Body> <Div class = "grande"> </ div> <Script> $ ( "Div") .Click (function () { $ (This) .switchClass ( "grande", "blu", 1000, "easeInOutQuad"); }); </ Script> </ Corpo> </ Html>