jQuery-Heißluftballon-Animation, durchscheinender Hintergrund, Anmeldeschnittstellencode, Sharing

jQuery-Heißluftballon-Animation, durchscheinender Hintergrund, Anmeldeschnittstellencode, Sharing_jquery

WBOY

Freigeben： 2016-05-16 15:41:46

Original

1565 Leute haben es durchsucht

Das Beispiel in diesem Artikel beschreibt die Implementierung des Anmeldefelds für den Hintergrund einer Heißluftballonanimation mit jQuery. Teilen Sie es als Referenz mit allen. Die Details lauten wie folgt:
Das Hintergrund-Anmeldefeld für die jQuery-Heißluftballonanimation ist ein Effektcode im Hintergrund-Anmeldeschnittstellenstil mit einem dynamischen durchscheinenden Hintergrund. Der Seiteneffekt ist einfach und elegant. Es handelt sich um einen sehr praktischen Spezialeffektcode, der es wert ist, erlernt zu werden.
Vorgangsrendering: -------------------Effekt anzeigen Quellcode herunterladen--------- - --------

Tipps: Wenn der Browser nicht richtig funktioniert, können Sie versuchen, den Browsermodus zu wechseln.
Die jQuery-Implementierung des mit Ihnen geteilten Login-Box-Codes für den Hintergrund der Heißluftballon-Animation lautet wie folgt

<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>jQuery热气球动画背景登录框</title>

<link href="css/main.css" rel="stylesheet" type="text/css" />

</head>
<body>


<div class="login">
  <div class="box png">
 <div class="logo png"></div>
 <div class="input">
  <div class="log">
  <div class="name">
   <label>用户名</label><input type="text" class="text" id="value_1" placeholder="用户名" name="value_1" tabindex="1">
  </div>
  <div class="pwd">
   <label>密　码</label><input type="password" class="text" id="value_2" placeholder="密码" name="value_2" tabindex="2">
   <input type="button" class="submit" tabindex="3" value="登录">
   <div class="check"></div>
  </div>
  <div class="tip"></div>
  </div>
 </div>
 </div>
  <div class="air-balloon ab-1 png"></div>
 <div class="air-balloon ab-2 png"></div>
  <div class="footer"></div>
</div>

<script type="text/javascript" src="js/jQuery.js"></script>
<script type="text/javascript" src="js/fun.base.js"></script>
<script type="text/javascript" src="js/script.js"></script>


<!--[if IE 6]>
<script src="js/DD_belatedPNG.js" type="text/javascript"></script>
<script>DD_belatedPNG.fix('.png')</script>
<![endif]-->
<div style="text-align:center;margin:50px 0; font:normal 14px/24px 'MicroSoft YaHei';">
</div>
</body>
</html>

Nach dem Login kopieren

Das Obige ist die jQuery-Implementierung des Hintergrund-Login-Box-Codes für Heißluftballons. Ich hoffe, es gefällt Ihnen.