CSS3實(shí)現(xiàn)動態(tài)背景登錄框的代碼
更新時(shí)間：2022年02月24日 09:57:41 作者：拎壺充
本文介紹了一款基于jQuery+CSS3實(shí)現(xiàn)的帶有動畫效果的動態(tài)背景登陸框特效，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
基于CSS3動態(tài)背景登錄框代碼。這是一款基于jQuery+CSS3實(shí)現(xiàn)的帶有動畫效果的動態(tài)背景登陸框特效。效果圖如下：
實(shí)現(xiàn)的代碼如下：
html代碼：
<div class="htmleaf-container">
<div class="wrapper">
<div class="container">
<h1>Welcome</h1>
<form class="form">
<input type="text" placeholder="Username">
<input type="password" placeholder="Password">
<button type="submit" id="login-button">Login</button>
</form>
</div>
<ul class="bg-bubbles">
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
</ul>
</div>
</div>
<script src="js/jquery-2.1.1.min.js" type="text/javascript"></script>
<script>
$('#login-button').click(function (event) {
event.preventDefault();
$('form').fadeOut(500);
$('.wrapper').addClass('form-success');
});
</script>
本文介紹的這款基于jQuery+CSS3實(shí)現(xiàn)的帶有動畫效果的動態(tài)背景登陸框特效，希望大家可以喜歡。
相關(guān)文章
剛才博客園的javascript首頁看到一個(gè)朋友的全選/反選效果。2010-04-04
為radio類型的INPUT添加客戶端腳本(附加實(shí)現(xiàn)JS來禁用onClick事件思路代碼)
為radio類型的INPUT添加客戶端腳本(附加實(shí)現(xiàn)JS來禁用onClick事件思路代碼)，需要的朋友可以參考下。2010-11-11
checkbox復(fù)選框不能為空，至少有一個(gè)選項(xiàng)2009-07-07
表單的一些基本用法與技巧...2006-07-07
簡單form標(biāo)準(zhǔn)化實(shí)例——語義結(jié)構(gòu)
簡單form標(biāo)準(zhǔn)化實(shí)例——語義結(jié)構(gòu)...2007-02-02
google 搜索框添加關(guān)鍵字實(shí)現(xiàn)代碼
一段創(chuàng)新的搜索腳本代碼來自tourbus的Bob Rankin提供了一段定制的JAVA代碼.2010-04-04
如何定義select的邊框顏色 解決思路： 學(xué)習(xí)了clip和margin屬性的用法，利用它們的特點(diǎn)，很容易就得出答案。2008-04-04
autocomplete禁止自動完成功能...2007-06-06
js動態(tài)在form上插入enctype=multipart/form-data的問題
在做文件上傳的時(shí)候碰到了一個(gè)比較奇怪的問題，IE6，7，8上傳文件總是失敗，服務(wù)端接收不到文件的問題2012-05-05
