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 相关文章推荐
用js小类库获取浏览器的高度和宽度信息
Jan 15 Javascript
jquery动画2.元素坐标动画效果(创建一个图片走廊)
Aug 24 Javascript
js实现图片放大缩小功能后进行复杂排序的方法
Nov 08 Javascript
jQuery焦点图切换特效插件封装实例
Aug 18 Javascript
JS实现固定在右下角可展开收缩DIV层的方法
Feb 13 Javascript
JavaScript改变CSS样式的方法汇总
May 07 Javascript
总结在前端排序中遇到的问题
Jul 19 Javascript
详解如何实现一个简单的Node.js脚手架
Dec 04 Javascript
react实现换肤功能的示例代码
Aug 14 Javascript
傻瓜式解读koa中间件处理模块koa-compose的使用
Oct 30 Javascript
JS实现网站吸顶条
Jan 08 Javascript
Vue实现boradcast和dispatch的示例
Nov 13 Javascript
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+resumablejs实现的分块上传 断点续传功能示例
2017/04/18 PHP
一个js写的日历(代码部分网摘)
2009/09/20 Javascript
JavaScript 数组循环引起的思考
2010/01/01 Javascript
javascript设计模式之工厂模式示例讲解
2014/03/04 Javascript
AngularJS入门教程之学习环境搭建
2014/12/06 Javascript
JavaScript删除数组元素的方法
2015/03/20 Javascript
详解Bootstrap的aria-label和aria-labelledby应用
2016/01/04 Javascript
浅谈javascript控制HTML5的全屏操控,浏览器兼容的问题
2016/10/10 Javascript
JS添加或修改控件的样式(Class)实现方法
2016/10/15 Javascript
详解Angular.js的$q.defer()服务异步处理
2016/11/06 Javascript
数组Array的排序sort方法
2017/02/17 Javascript
VUE多层路由嵌套实现代码
2017/05/15 Javascript
ionic grid(栅格)九宫格制作详解
2018/06/30 Javascript
jQuery实现的页面弹幕效果【测试可用】
2018/08/17 jQuery
[26:24]完美副总裁、DOTA2负责人蔡玮专访:电竞如人生
2014/09/11 DOTA
Python中MySQL数据迁移到MongoDB脚本的方法
2016/04/28 Python
Python中文分词工具之结巴分词用法实例总结【经典案例】
2017/04/15 Python
Python 中字符串拼接的多种方法
2018/07/30 Python
python采集微信公众号文章
2018/12/20 Python
Python 获取ftp服务器文件时间的方法
2019/07/02 Python
python 利用浏览器 Cookie 模拟登录的用户访问知乎的方法
2019/07/11 Python
python os.path.isfile()因参数问题判断错误的解决
2019/11/29 Python
使用pyhon绘图比较两个手机屏幕大小(实例代码)
2020/01/03 Python
python判断两个序列的成员是否一样的实例代码
2020/03/01 Python
利用Python脚本批量生成SQL语句
2020/03/04 Python
澳大利亚排名第一的露营和户外设备在线零售商:Outbax
2020/05/06 全球购物
家庭贫困证明范本(经典版)
2014/09/22 职场文书
幼儿园综治宣传月活动总结
2015/05/07 职场文书
2015年社区教育工作总结
2015/05/13 职场文书
读完《骆驼祥子》的观后感!
2019/07/05 职场文书
python 用递归实现通用爬虫解析器
2021/04/16 Python
整理Python中常用的conda命令操作
2021/06/15 Python
Python实现PIL图像处理库绘制国际象棋棋盘
2021/07/16 Python
python编程项目中线上问题排查与解决
2021/11/01 Python
css filter和getUserMedia的联合使用
2022/02/24 HTML / CSS
详解Python flask的前后端交互
2022/03/31 Python