Latest web development tutorials

jQuery UI API - effets de transfert (Effet de transfert)

catégorie

Effets spéciaux (effets)

usage

Description: L'élément de contour à un autre élément.

transfer

参数 类型 描述
className String 转移的元素将接收的参数化的 class 名称。
to String jQuery 选择器，要转移到的元素。

Lors d'une tentative pour visualiser l'interaction entre deux éléments est très utile.

Transfert élément avec lui - même, la classe ui-effects-transfer , d' autres styles doivent être définis par vous, par exemple, ajouter un fond ou à la frontière.

Exemples

Cliquez sur l'élément vert le transférer à un autre élément. 

<! DOCTYPE html>
<Html lang = "fr">
<Head>
  <Meta charset = "utf-8">
  <Titre> effets de transfert (effet de transfert) Demo </ title>
  <Link rel = "stylesheet" href = "// code.jquery.com/ui/1.10.4/themes/smoothness/jquery-ui.css">
  <Style>
  div.green {
    largeur: 100px;
    hauteur: 80px;
    fond: vert;
    border: 1px solid black;
    position: relative;
  }
  div.red {
    margin-top: 10px;
    largeur: 50px;
    hauteur: 30px;
    background: red;
    border: 1px solid black;
    position: relative;
  }
  .ui-effets-transfert {
    border: 1px noir en pointillés;
  }
  </ 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>
 
<Class Div = "green"> </ div>
<Class Div = "red"> </ div>
 
<Script>
$ ( «Div») .cliquez (function () {
  var i = 1 - $ ( "div") .index (this);
  $ (Ce) .effect ( «transfert», {à: $ ( "div") .EQ (i)}, 1000);
});
</ Script>
 
</ Body>
</ Html>

la