月度归档:2011年04月

关于jquery方法closest()

最近发现jquery 1.4中文手册中对于closest()方法的context描述有误。

中文手册的描述:

closest(expr,[context] )

参数

expr (String, Array) : 用以过滤元素的表达式。jQuery 1.4开始,也可以传递一个字符串数组,用于查找多个元素。

context (可选) (Element, jQuery) : 作为待查找的 DOM 元素集、文档或 jQuery 对象。

其中描红的文字“jquery对象”,是错误的用法,官方文档没有说明可以是jquery对象(实际测试,也确实不可以是jquery对象)。

附上官方文档说明(官方仅指出是一个dom element):

.closest( selector, [ context ] )

selector       A string containing a selector expression to match elements against.

context        A DOM element within which a matching element may be found. If no context is passed in then the context of the jQuery set will be used instead.

PS. 另外发现一个特性:

<body>
    <ul>
        <li>
            <p id="test">test context for this</p>
        </li>
    </ul>
</body>

当使用$(“#text”).closest(‘li’, $(“#text”)[0])时,即context为元素本身,则会继续向上寻找,返回li,而不是空元素。

jCarouselLite-好用的图片滚动插件,修改加入悬停习惯

插件Home:http://www.gmarwaha.com/jquery/jcarousellite/index.php

一直在用,并且没有想过自己再造轮子的插件,作用是图片列表上下或垂直滚动,可以添加方向控制按钮,你应该懂的。

用法很简单,jquery插件通用的套路,具体看官网。个人对这个插件做了下修改,当设置为自动滚动时候,鼠标放上去可以停止,离开则继续,同时增加一个button inactive类名设置。下面进入正题。

Continue reading jCarouselLite-好用的图片滚动插件,修改加入悬停习惯

不定大小的图片居中,并拥有等宽的信息条


看效果就知道了。

<!DOCTYPE html>
<html>
 <head>
  <title> new document </title>
  <meta charset="utf-8" />
  <style>
  .item-wrap {width:800px;background:#f60;text-align:center}
  .item-meta, .item-link {display:inline-block;text-align:right}
	.item-intro {display:block;padding:2px;background:#333;color:#fff;text-align:center;}
	.item-link {background:green}
  </style>
 </head>

 <body>
	<div class="item-wrap">
		<span class="item-meta">
			<img alt="" src="" style="display:block;width:300px;height:400px" />
			<span class="item-intro">信息的显示</span>
			<a class="item-link">一个链接</a>
		</span>
	</div>
 </body>
</html>