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 相关文章推荐
javascript 防止刷新,后退,关闭
Aug 07 Javascript
javascript中字符串的定义示例代码
Dec 19 Javascript
JS+JSP checkBox 全选具体实现
Jan 02 Javascript
Bootstrap与KnockoutJs相结合实现分页效果实例详解
May 03 Javascript
js改变css样式的三种方法推荐
Jun 28 Javascript
JS简单测试循环运行时间的方法
Sep 04 Javascript
jquery使用EasyUI Tree异步加载JSON数据(生成树)
Feb 11 Javascript
js实现PC端根据IP定位当前城市地理位置
Feb 22 Javascript
vue指令以及dom操作详解
Mar 04 Javascript
BootStrap+Mybatis框架下实现表单提交数据重复验证
Mar 23 Javascript
javascript实现非常简单的小数取整功能示例
Jun 13 Javascript
NUXT SSR初级入门笔记(小结)
Dec 16 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
关于拼配咖啡,你要知道
2021/03/03 咖啡文化
PHP中使用CURL伪造来路抓取页面或文件
2011/05/04 PHP
PHP+jQuery实现自动补全功能源码
2013/05/15 PHP
fetchAll()与mysql_fetch_array()的区别详解
2013/06/05 PHP
ajax返回值中有回车换行、空格的解决方法分享
2013/10/24 PHP
你可能不知道PHP get_meta_tags()函数
2014/05/12 PHP
PHP中通过fopen()函数访问远程文件示例
2014/11/18 PHP
CI框架中redis缓存相关操作文件示例代码
2016/05/17 PHP
TextArea不支持maxlength的解决办法(jquery)
2011/09/13 Javascript
javascript学习(二)javascript常见问题总结
2013/01/02 Javascript
js实现倒计时(距离结束还有)示例代码
2013/07/24 Javascript
js中不同的height, top的区别对比
2015/09/24 Javascript
第一篇初识bootstrap
2016/06/21 Javascript
JavaScript中的遍历详解(多种遍历)
2017/04/07 Javascript
使用vue构建一个上传图片表单
2017/07/04 Javascript
ES6扩展运算符的用途实例详解
2017/08/20 Javascript
实例讲解JavaScript截取字符串
2018/11/30 Javascript
vue+element项目中过滤输入框特殊字符小结
2019/08/07 Javascript
python字典get()方法用法分析
2015/04/17 Python
定制FileField中的上传文件名称实例
2017/08/23 Python
python matplotlib 注释文本箭头简单代码示例
2018/01/08 Python
python得到qq句柄,并显示在前台的方法
2018/10/14 Python
Python绘图Matplotlib之坐标轴及刻度总结
2019/06/28 Python
python Gunicorn服务器使用方法详解
2019/07/22 Python
Python 操作 ElasticSearch的完整代码
2019/08/04 Python
Pycharm中出现ImportError:DLL load failed:找不到指定模块的解决方法
2019/09/17 Python
Python使用Pandas库常见操作详解
2020/01/16 Python
css3实现画半圆弧线的示例代码
2017/11/06 HTML / CSS
HTML5中的新元素介绍
2008/10/17 HTML / CSS
电子信息工程专业推荐信
2014/02/14 职场文书
搞笑车尾标语
2014/06/23 职场文书
2014年优质护理服务工作总结
2014/11/14 职场文书
2014年酒店工作总结与计划
2014/11/17 职场文书
python读取pdf格式文档的实现代码
2021/04/01 Python
Pandas加速代码之避免使用for循环
2021/05/30 Python
室外天线与收音机天线杆接合方法
2022/04/05 无线电