jQuery热气球动画半透明背景的后台登录界面代码分享


Posted in Javascript onAugust 28, 2015

本文实例讲述了jQuery实现热气球动画背景登录框。分享给大家供大家参考。具体如下:
jQuery热气球动画背景登录框是一款动态半透明背景的后台登录界面样式效果代码。页面效果简洁大方,是一款非常实用的特效代码,值得大家学习。
运行效果图:-------------------查看效果 下载源码-------------------

jQuery热气球动画半透明背景的后台登录界面代码分享

小提示:浏览器中如果不能正常运行,可以尝试切换浏览模式。
为大家分享的jQuery实现热气球动画背景登录框代码如下

<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>

以上就是为大家分享的jQuery实现热气球动画背景登录框代码,希望大家可以喜欢。

Javascript 相关文章推荐
jQuery 操作XML入门
Dec 25 Javascript
在IE浏览器中resize事件执行多次的解决方法
Jul 12 Javascript
15条JavaScript最佳实践小结
Aug 09 Javascript
JavaScript中的类(Class)详细介绍
Dec 30 Javascript
javascript通过元素id和name直接取得元素的方法
Apr 28 Javascript
7个jQuery最佳实践
Jan 12 Javascript
详解Angular 4.x 动态创建组件
Apr 25 Javascript
vue webpack打包优化操作技巧
Feb 22 Javascript
layUI实现前端分页和后端分页
Jul 27 Javascript
layui表格内容溢出的解决方法
Sep 06 Javascript
Js参数RSA加密传输之jsencrypt.js的使用
Feb 07 Javascript
Vue.Draggable实现交换位置
Apr 07 Vue.js
jquery实现未经美化的简洁TAB菜单效果
Aug 28 #Javascript
基于jQuery实现Div窗口震动特效代码-代码简单
Aug 28 #Javascript
js实现显示当前状态的导航效果代码
Aug 28 #Javascript
jQuery实现表单步骤流程导航代码分享
Aug 28 #Javascript
AngularJS+Node.js实现在线聊天室
Aug 28 #Javascript
JS实现仿苹果底部任务栏菜单效果代码
Aug 28 #Javascript
jquery实现弹出层登录和全屏层注册特效
Aug 28 #Javascript
You might like
php set_magic_quotes_runtime() 函数过时解决方法
2010/07/08 PHP
php实现的Timer页面运行时间监测类
2014/09/24 PHP
symfony表单与页面实现技巧
2015/01/26 PHP
php防止网站被攻击的应急代码
2015/10/21 PHP
php版微信数据统计接口用法示例
2016/10/12 PHP
Yii2实现log输出到file及database的方法
2016/11/12 PHP
php基于自定义函数记录log日志方法
2017/07/21 PHP
laravel 数据迁移与 Eloquent ORM的实现方法
2019/04/12 PHP
lib.utf.js
2007/08/21 Javascript
JavaScript 节点操作 以及DOMDocument属性和方法
2007/12/06 Javascript
利用jquery操作Radio方法小结
2014/10/20 Javascript
jQuery实现下滑菜单导航效果代码
2015/08/25 Javascript
jquery datatable服务端分页
2016/08/31 Javascript
浅谈javascript控制HTML5的全屏操控,浏览器兼容的问题
2016/10/10 Javascript
Json按某个键的值进行排序
2016/12/22 Javascript
微信小程序Redux绑定实例详解
2017/06/07 Javascript
javascript实现Java中的Map对象功能的实例详解
2017/08/21 Javascript
详解Angular2学习笔记之Html属性绑定
2018/01/03 Javascript
详解react内联样式使用webpack将px转rem
2018/09/13 Javascript
解决Vue动态加载本地图片问题
2019/10/09 Javascript
用Python给文本创立向量空间模型的教程
2015/04/23 Python
详解Python中for循环是如何工作的
2017/06/30 Python
python pandas 如何替换某列的一个值
2018/06/09 Python
python3使用matplotlib绘制条形图
2020/03/25 Python
使用pymysql查询数据库,把结果保存为列表并获取指定元素下标实例
2020/05/15 Python
python线程池如何使用
2020/05/28 Python
Python3爬虫中Selenium的用法详解
2020/07/10 Python
浅谈Python 命令行参数argparse写入图片路径操作
2020/07/12 Python
Python3如何实现Win10桌面自动切换
2020/08/11 Python
英国50岁以上人群的交友网站:Ourtime
2018/03/28 全球购物
惠普新加坡官方商店:HP Singapore
2020/04/17 全球购物
关于梦想的演讲稿
2014/05/05 职场文书
三八红旗手事迹材料
2014/12/26 职场文书
一年级语文下册复习计划
2015/01/17 职场文书
小学教研工作总结2015
2015/05/13 职场文书
小程序后台PHP版本部署运行 LNMP+WNMP
2021/04/01 Servers