jq给页面添加覆盖层遮罩的实例
更新时间：2017年02月16日 08:10:24 投稿：jingxian
下面小编就为大家带来一篇jq给页面添加覆盖层遮罩的实例。小编觉得挺不错的，现在就分享给大家，也给大家做个参考。一起跟随小编过来看看吧
先引入jq代码，然后代码如下：
$(function(){
var docHeight = $(document).height(); //获取窗口高度
$('body').append('<div id="overlay"></div>');
$('#overlay')
.height(docHeight)
.css({
'opacity': .9, //透明度
'position': 'absolute',
'top': 0,
'left': 0,
'background-color': 'black',
'width': '100%',
'z-index': 5000 //保证这个悬浮层位于其它内容之上
});
setTimeout(function(){$('#overlay').fadeOut('slow')}, 3000); //设置3秒后覆盖层自动淡出
});
以上这篇jq给页面添加覆盖层遮罩的实例就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持脚本之家。
相关文章
jquery+ashx无刷新GridView数据显示插件(实现分页、排序、过滤功能)
最近做一个AJAX的GridView来显示数据，当然按照现在流行的首选是Jquery。2010-04-04
在Web开发中,表单提交是一个常见的操作,通过表单提交用户可以向服务器发送数据,jQuery是一个流行的JavaScript库,可以简化处理JavaScript的操作,包括表单提交,在本篇博客中,我们将介绍如何使用jQuery来实现表单提交操作,需要的朋友可以参考下2024-09-09
这篇文章主要介绍了jquery中的ajax方法怎样通过JSONP进行远程调用,需要的朋友可以参考下2014-05-05
jQuery头像裁剪工具jcrop用法实例(附演示与demo源码下载)
这篇文章主要介绍了jQuery头像裁剪工具jcrop用法,结合实例形式分析了jQuery头像裁剪工具jquery.jcrop.js具体使用技巧,并附带了完整的demo源码供读者下载参考,需要的朋友可以参考下2016-01-01
在一些电商网站我们都见到使用过放大镜来查看商品详情，那么基于jquery代码是如何实现放大镜效果的呢？下面由脚本之家小编给大家分享jquery代码实现放大镜效果2016-03-03
今天给大家推荐一款不一样的jQuery类似瀑布流插件，使文字也能实现瀑布流效果，有需要的小伙伴可要好好看仔细了。2014-11-11
这篇文章主要内容是jQuery无刷新切换主题皮肤实例讲解，本文应用cookie记录用户所选择设置的主题皮肤样式，需要了解的朋友可以参考下2015-10-10
使用$.get可以获取一个文件的内容，实现很简单，示例如下，喜欢的朋友可以参考下2013-09-09
jQuery ajax仿Google自动提示SearchSuggess功能示例
这篇文章主要介绍了jQuery ajax仿Google自动提示SearchSuggess功能,结合实例形式较为详细的分析了jQuery结合ajax与.net后台调用sql数据库实现搜索自动提示相关操作技巧,需要的朋友可以参考下2019-03-03
jQuery操作checkbox选择(list/table)
本文将介绍下checkbox list选择及checkbox table选中附效果图，感兴趣的朋友可以参考下哈，希望可以帮助到你2013-04-04
最新评论