CSS手写遮罩
2016-08-23 17:11
295 查看
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <style type="text/css"> .backdrop { position: fixed; z-index: 998; top: 0; right: 0; bottom: 0; left: 0; background-color: rgba(0,0,0,.3); } </style> <script src="../js/jquery-1.11.2.min.js" type="text/javascript" charset="utf-8"></script> <script type="text/javascript"> $(function(){ $('#te').on('click',function(){ $('#loading').css('display','block') setTimeout(function(){ $('#loading').css('display','none') },3000) }) }) </script> </head> <body> <button id='te'>打开遮罩</button> <div id='loading' class="backdrop " style="display: none;"> <img src="" alt="" /> <!--自己放loding图片--> </div> </body> </html>
当数据加载开始时,将遮罩打开,结束时将其关闭。
相关文章推荐
- CSS遮罩——如何在CSS中使用遮罩
- CSS手写代码总结
- JS+CSS简单实现DIV遮罩层显示隐藏
- css 手写tab选项卡
- css实现遮罩效果以及帧布局使用
- JS+CSS简单实现DIV遮罩层显示隐藏
- CSS中的五大字体家族(cursive 手写字体族更吸引我)
- JS+CSS实现弹出全屏灰黑色透明遮罩效果的方法
- JS+CSS简单实现DIV遮罩层显示隐藏
- DIV+CSS页面布局示例 遮罩层
- css遮罩代码(已验证)
- CSS中的剪裁和遮罩
- 手写样式表:CSS语法全攻略(1)
- css hover遮罩层
- Mirror app HTML样式CSS之DIV遮罩背景层样式
- 用CSS手写导航条没有任何图片附效果图
- 网页添加div 遮罩层 js+css 半透明效果
- DIV遮罩层如何实现_Div+CSS教程_CSS_网页制作
- CSS实现镂空遮罩引导层
- css做遮罩了写法