jQuery实现网站添加高亮突出显示效果的方法

   本文实例讲述了jQuery实现网站添加高亮突出显示效果的方法。分享给大家供大家参考。具体如下:

  这段jquery代码演示了如何把整个页面遮罩起来,突出显示某些东西

  ?

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15

$(function() {
var docHeight = $(document).height();
$("body").append("<div id='overlay'></div>");
$("#overlay")
.height(docHeight)
.css({
'opacity' : 0.4,
'position': 'absolute',
'top': 0,
'left': 0,
'background-color': 'black',
'width': '100%',
'z-index': 5000
});
});

  希望本文所述对大家的jQuery程序设计有所帮助。

时间: 2024-08-04 02:25:30

jQuery实现网站添加高亮突出显示效果的方法的相关文章

给网站添加IE6升级提示代码的方法

IE6的是一款横跨十年的浏览器,作为一枚前端,对其已经失望透顶,但其在中国的市场比仍旧很高,中国大量的PC上安装的都是盗版Windows XP,而Windows XP上的预装浏览器就是IE6. 面对如今硬件加速和支持HTML5的浏览器来说,IE6无论在安全性和兼容性上简直就是一垃圾中的垃圾,而对搞UED和前端的设计师而言,更是如噩梦般的存在.但是我想,无论你是普通用户还是网站开发人员或者是国内的浏览器开发者,我们都应该采取一些措施,共同促进IE6的灭亡. 作为一枚前端开发人员争取放弃兼容IE6,

jQuery实现的添加到产品对比的方法

产品对比相信大家并不陌生,为了方便用户对类似产品的相关信息进行有效直观的对比,一些电商网站产品或评测网站会为用户提供产品对比的功能,用户只需勾选多个需要对比的产品,就可以进行比对.本文将使用jQuery来给大家讲解如何实现产品对比功能. HTML HTML结构我们分三部分,第一是产品列表部分,展示所有可以对比的产品.我们以某手机网站为例,简单的结构,只需展示产品图片和名称,以及一个添加按钮.注意我们把手机的相关参数信息都放在属性data-*里,等会后面展示对比信息的时候会用到. <div cla

jquery 如何动态添加、删除class样式方法介绍_jquery

取与设置样式 获取class和设置class都可以使用attr()方法来完成.例如使用attr()方法来获取p元素的class,JQuery代码如下: 复制代码 代码如下: var p_class = $("p").attr("class"); //获取p元素的class [html] 使用attr()方法来设置p元素的class,JQuery代码如下: [code] 1 $("p").attr("'class", "

WORDPRESS给网站添加关键词和描述的方法

我们在安装好了wordpress的程序之后,发现只能填写网站标题和副标题,而关键词的添加和描述的添加都没有,对于一般人来说这可能没有什么关系,但是对于seo来说这可不是小事情,这可是网站排名的关键词排名不可或缺的,那么如何在wordpress增加关键词和描述呢?其实方法有很多,而最简单的方法就是利用插件达到效果,不过插件安装过多可不是好事,这里年少就介绍一个简单的方法,只要在头部文件(header.php)增加代码可以实现wordpress关键词和描述. 方法一,直接编辑模板文件 进入后台,如图

为网站添加IE6升级提示

原文 为网站添加IE6升级提示 IE6的是一款横跨十年的浏览器,作为一枚前端,对其已经失望透顶,但其在中国的市场比仍旧很高,中国大量的PC上安装的都是盗版Windows XP,而Windows XP上的预装浏览器就是IE6. 面对如今硬件加速和支持HTML5的浏览器来说,IE6无论在安全性和兼容性上简直就是一垃圾中的垃圾,而对搞UED和前端的设计师而言,更是如噩梦般的存在.但是我想,无论你是普通用户还是网站开发人员或者是国内的浏览器开发者,我们都应该采取一些措施,共同促进IE6的灭亡. 作为一枚

25种方式给网站添加优质内容

我们早已知道,网站的质量在Google中起关键作用.高级Google工程师Matt Cutts在他的blog中多次提到,"优质"对于Google至关重要,无论是内容还是连接. 不过,创建内容和连接并不一定要经历痛苦的过程.网站搭建者们开始趋于从某些角度考虑如何组织内容.所以,让我们放开创新的思维,来想一想所有这些给网站添加优质内容的方法吧. 请先记住以下几点: 你只是被你自己的想法和你的网站限制住了.尝试着往完全不同的方向探索一下. 你的网站内容应该是写给你的顾客看,而不是给你.网站内

jQuery实现的图文高亮滚动切换特效实例_jquery

本文实例讲述了jQuery实现的图文高亮滚动切换特效.分享给大家供大家参考.具体如下: 这里介绍jQuery图文高亮滚动切换特效,jQuery鼠标滑过图文开关灯切换特效,背景变暗,子内容向上滑动显示出来,鼠标的操作感极强,希望大家喜欢本效果. 运行效果截图如下: 具体代码如下: <!DOCTYPE html> <html lang="en"> <head> <title>jQuery图文高亮滚动切换</title> <s

jQuery插件dataTables添加序号列的方法_jquery

官网方法实例: $(document).ready(function() { var t = $('#example').DataTable({ "columnDefs": [{ "searchable": false, "orderable": false, "targets": 0 }], "order": [[1, 'asc']] }); t.on('order.dt search.dt', func

怎样在Win10系统下把不兼容的网站添加到兼容模式列表

相信很多用户都有遇到过兼容性问题,这种情况下我们一般要进行兼容性设置才能正常使用,有不少Win10系统用户使用IE浏览器浏览一些网站时,发现网站在IE浏览器上显示出现一些问题.这是由于微软在IE8以上的版本之后,增加了一个兼容模式.对于某些网站必须要启用兼容模式才能运行插件,兼容网站.但是微软当然考虑到这个问题,我们可以将网站添加到IE的兼容模式列表,这样就能正常浏览该网站.有需要的朋友一起来看一下! 操作方法: 1.在IE上,点击设置,选择兼容性视图设置. 2.在输入框中输入网址. 3.输入完