jQuery实现渐变效果的下拉导航菜单
HTML代码： <div id="nav"> <ul> <li> <a href="http://neirong.org" target="_blank">资源共享</a> <ul> <li><a href="http://neirong.org" target="_blank">资源共享</a></li> <li><a href="http://neirong.org" target="_blank...
详细介绍css display:block的用法
根据CSS规范的规定，每一个网页元素都有一个display属性，用于确定该元素的类型，每一个元素都有默认的display属性值，比如div元素，它的默认display属性值为“block”，成为“块级”元素(block-level)；而span元素的默认display属性值为“inline”，称为“行内”元素。 块级元素： 动占据一定矩形空间，可以通过设置高度、宽度、内外边距等属性，来调整的这个矩形的样子； 行内元素： 自己的独立空间，它是依附于其他块级元素存在的，因此，对行内元素设置高度、宽度、内外边距等属性，都是无效的。 ...
多种切换过渡效果小巧jQuery图片幻灯片插件Coin Slider
Coin Slider是款很小巧，简单易用，具有多种图片过渡效果的jquery幻灯片插件。 使用方法： 下载插件：http://pan.baidu.com/s/1pJNriFD 引用文件： <script type="text/javascript" src="jquery-1.4.2.js"></script> <script type="text/javascript" src="coin-slider.min.js"></script> <link rel="sty...
网页图片轮换播放器Bcastr4.0使用教程
Bcastr.swf是一款优秀的通用图片轮换播放器，很多网站程序使用的图片轮播功能，如织梦CMS就是内置了bcastr.swf实现图片轮播，图片轮播很多人第一时间想到使用jquery实现，其实对于普通用户来说，使用 Bcastr可以更轻松的制作图片轮换效果，目前Bcastr 4.0是最新版，它有如下的特点： 可以读取xml设置播放列表,自定义xml地址 可以将图片地址直接写网页中直接,不需要xml 自动适应图片大小 ...
jquery实现网页背景变暗的弹框效果
很多网页的登陆就是在页面上弹出一个登陆框，背景变暗，通过jquery可以实现这个效果： Javascript代码： var GB_DONE = false; var GB_HEIGHT = 400; var GB_WIDTH = 400; function GB_show(caption, url, height, width) { $("GB_window").remove(); GB_HEIGHT = height || 400; GB_WIDTH = width || 400; if(!GB_DONE) { ...
div嵌套导致子区域margin-top失效不起作用的解决方法
有两个嵌套关系的div，如果外层div的父元素padding值为0，那么内层div的margin-top或者margin-bottom的值会“转移”给外层div，使父元素产生上外边距。 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> ...
jQuery图片居中裁切效果
给img标签添加样式.t-img <img src="images/1.jpg" class="t-img"> 注：需要给img标签的父层定义宽高 //调用 $(function(){ zmnImgCenter($(".t-img"));//JQ的dom }); //图片居中 function zmnImgCenter(obj){ obj.each(function(){ var $this=$(this); var objHeight=$this.height();//图片高度 var objWidth=$this...
jQuery元素筛选方法集合
1、eq() 筛选指定索引号的元素 2、first() 筛选出第一个匹配的元素 3、last() 筛选出最后一个匹配的元素 4、hasClass() 检查匹配的元素是否含有指定的类 5、filter() 筛选出与指定表达式匹配的元素集合 6、is() 检查元素是否参数里能匹配上的 7、map() 8、has() 筛选出包含指定子元素的元素 9、not() 排除能够被参数中匹配的元素 10、slice() 从指定索引开始，截取指定个数的元素 ...
实现各浏览器html图像灰度 跨浏览器图像灰度(grayscale)解决方案
实现图像灰度（grayscale）最初有ie6推出的专属属性filter实现，后来在css3里w3c实现了标准的filter，但是在不同浏览器的实现程度不一样，因此需要一种浏览器兼容的解决方案。 IE私有滤镜的方式：自IE4开始，IE引入了私有滤镜，可以实现透明度、模糊、阴影、发光等效果，当然也可以实现灰度图像效果。代码如下： img { filter: gray; /* just for IE6-9 */ } IE10开始抛弃了这种私有滤镜，但是还没有提供对标准CSSfilter的支持，所以说IE10以上版本的灰度图像，仍然是一个问题...
实现网页布局的自适应@media screen各max-width和min-width大小
不同分辨率设备或不同窗口大小下布局 @media screen and(min-width:1200px) { } @media screen and(min-width:960px)and(max-width:1199px) { } @media screen and(min-width:768px)and(max-width:959px) { } @media only screen and(min-width:480px)and(max-width:767px) { } @media only screen and(max-width:479px) { }
CSS3选择器nth-child(n)实现隔几行选择元素
nth-child(n)，n 可以是数字、关键词或公式。选择器匹配属于其父元素的第N个子元素，不论元素的类型。 序号写法： li:nth-child(3){background:orange;}/*把第3个LI的背景设为橙色*/ 倍数写法： li:nth-child(3n){background:orange;}/*把第3、第6、第9、…、所有3的倍数的LI的背景设为橙色*/ 倍数分组匹配： li:nth-child(3n+1){background:orange;}/*匹配第1、第4、第7、…、每3个为一组的第1个LI*/ li:nth-child(3n+5...
list-style-image失效background替换方法
使用css+html制作网页时，经常会出现css代码在某浏览器没有效果的情况，如list-style-image代码就经常不能显示出图标，有些时候是因为使用了float的原因，有些时候却难以发现是什么原因。解决的方法一般是使用background背景图片的方法。 如以下css代码： #sidebar ul {margin:15px 0;} #sidebar ul li {line-height:1.5em; padding-left:10px; background:url(images/post.jpg) no-repeat center left; font-...