基于CSS3动态背景登录框代码。这是一款基于jQuery+CSS3实现的带有动画效果的动态背景登陆框特效。效果图如下:
实现的代码如下:
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实现的带有动画效果的动态背景登陆框特效,希望大家可以喜欢。
您可能感兴趣的文章:
- CSS3实现3D文字动画效果
- 6款新颖的jQuery和CSS3进度条插件推荐
- 7款风格新颖的jQuery/CSS3菜单导航分享
- 7款吸引人眼球的jQuery/CSS3特效实例分享
- Css3制作变形与动画效果
- 基于Css3和JQuery实现打字机效果
- 纯CSS3代码实现滑动开关效果
- 利用CSS3新特性创建透明边框三角