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 使用手册(四)
Sep 23 Javascript
使用jquery实现图文切换效果另加特效
Jan 20 Javascript
js中Image对象以及对其预加载处理示例
Nov 20 Javascript
调整小数的格式保留小数点后两位
May 14 Javascript
浅谈jquery.fn.extend与jquery.extend区别
Jul 13 Javascript
jquery ajax分页插件的简单实现
Jan 27 Javascript
jQuery实现的倒计时效果实例小结
Apr 16 Javascript
Vue.js开发环境搭建
Nov 10 Javascript
原生js编写基于面向对象的分页组件
Dec 05 Javascript
JS简单实现动态添加HTML标记的方法示例
Apr 08 Javascript
vue实现数据控制视图的原理解析
Jan 07 Javascript
微信小程序点击生成朋友圈分享图(遇到的坑)
Jun 17 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内核探索之解释器的执行过程
2015/12/22 PHP
PHP正则匹配日期和时间(时间戳转换)的实例代码
2016/12/14 PHP
PHP CURL使用详解
2019/03/21 PHP
PHP执行linux命令6个函数代码实例
2020/11/24 PHP
PNGHandler-借助JS让PNG图在IE下实现透明(包括背景图)
2007/08/31 Javascript
jQuery 性能优化指南(3)
2009/05/21 Javascript
jQuery中实现动画效果的基本操作介绍
2013/04/16 Javascript
jQuery如何取id有.的值一般的方法是取不到的
2014/04/18 Javascript
javascript写的异步加载js文件函数(支持数组传参)
2014/06/07 Javascript
webpack中引用jquery的简单实现
2016/06/08 Javascript
简单好用的nodejs 爬虫框架分享
2017/03/26 NodeJs
JavaScript实现三级联动菜单实例代码
2017/06/26 Javascript
JS运动改变单物体透明度的方法分析
2018/01/23 Javascript
vue-cli开发环境实现跨域请求的方法
2018/04/07 Javascript
vue+SSM实现验证码功能
2018/12/07 Javascript
node.js命令行教程图文详解
2019/05/27 Javascript
[01:09:24]Ti4开幕式
2014/07/19 DOTA
Python数据报表之Excel操作模块用法分析
2019/03/11 Python
深入浅析Python中的迭代器
2019/06/04 Python
pandas DataFrame创建方法的方式
2019/08/02 Python
Pycharm使用远程linux服务器conda/python环境在本地运行的方法(图解))
2019/12/09 Python
python计算波峰波谷值的方法(极值点)
2020/02/18 Python
django xadmin 管理器常用显示设置方式
2020/03/11 Python
Django form表单与请求的生命周期步骤详解
2020/06/07 Python
Tensorflow全局设置可见GPU编号操作
2020/06/30 Python
python和opencv构建运动检测器的实现
2021/03/03 Python
斯洛伐克时尚服装网上商店:Cellbes
2016/10/20 全球购物
ABOUT YOU匈牙利:500个最受欢迎的时尚品牌
2019/07/19 全球购物
惠而浦美国官网:Whirlpool.com
2021/01/19 全球购物
如何现实servlet的单线程模式
2014/08/05 面试题
科技开发中心办公室主任岗位责任制
2014/02/10 职场文书
供用电专业求职信
2014/07/07 职场文书
2014年大学生社会实践自我鉴定
2014/09/26 职场文书
2015年环保局工作总结
2015/05/22 职场文书
sql中mod()函数取余数的用法
2021/05/29 SQL Server
python中urllib包的网络请求教程
2022/04/19 Python