JQuery滑动切换插件

/*-----------------------------------------------------------------------------------------/
 * JQuery PlugIn - Slide Show(or, Switch Tab) Written By KEVIN SHEEP(###)
 * Based On JQuery 1.2.6+
 * JQuery滑动切换插件 ver 1.2.0
 *
 * defaultIndex 	- 默认选中的标签索引,从0开始
 * titOnClassName	- 标签选中时的样式
 * titCell			- 自定义标题标签,支持选择符
 * mainCell			- 自定义标题标签,支持选择符
 * delayTime		- 延迟触发时间. 当这个时间小于切换动画效果时间时, 动画将被禁用
 * interTime		- 自动切换时间. 当这个时间大于0时, 标签将定时自动切换
 * trigger			- 滑动触发方式. 默认为click, 可选择mouseover
 * effect			- 切换动画. 默认不使用动画. 目前仅提供fade(淡出), slide(向下展开)两种
 * omitLinks		- 是否忽略带链接标签,默认为否
 * debug			- 调试模式. 默认关闭
/*----------------------------------------------------------------------------------------*/

1,默认设置

焦点新闻 时尚推荐 技术观点 业界报道
· 山顶洞羊作品 jQuery 滑动切换插件横空出世
· 山顶洞,jQuery,插件
· 黑夜给了我黑色的眼睛,我用它去寻找光明
· 羊大仙向网友推送的jQuery插件赢得一致好评
调用代码
$("#switchBox").switchTab();

2,使用fade切换效果

焦点新闻 时尚推荐 技术观点
· 山顶洞羊作品 jQuery 滑动切换插件横空出世
· 山顶洞,jQuery,插件
· 黑夜给了我黑色的眼睛,我用它去寻找光明
调用代码
$("#switchBox2").switchTab({effect: "fade"});

3,使用不同的标题容器(标题带链接),悬停切换

焦点新闻 时尚推荐 技术观点 业界报道
· 山顶洞羊作品 jQuery 滑动切换插件横空出世
· 山顶洞,jQuery,插件
· 黑夜给了我黑色的眼睛,我用它去寻找光明
· 羊大仙向网友推送的 jQuery 插件获得一致好评
调用代码
$("#switchBox3").switchTab({titCell: "dt a", trigger: "mouseover", delayTime: 0});

4,悬停300毫秒后切换,使用fade效果

焦点新闻 时尚推荐 技术观点 业界报道
· 山顶洞羊作品 jQuery 滑动切换插件横空出世
· 山顶洞,jQuery,插件
· 黑夜给了我黑色的眼睛,我用它去寻找光明
· 羊大仙向网友推送的 jQuery 插件获得一致好评
调用代码
$("#switchBox4").switchTab({titCell: "dt a", effect: "fade", trigger: "mouseover", delayTime: 300});

5,内容容器也换换,使用指定的高亮样式active,默认第二个选中,使用slide效果

焦点新闻 时尚推荐 技术观点 业界报道 多加一个框框 再来一个
调用代码
$("#switchBox5").switchTab({defaultIndex: "1", titOnClassName: "active", titCell: "dt em", mainCell: "dd ul", effect: "slide"});

6,使用类选择器来一次激活多个滑动门(慎用)

焦点新闻 时尚推荐 技术观点 业界报道
· 山顶洞羊作品 jQuery 滑动切换插件横空出世
· 山顶洞,jQuery,插件
· 黑夜给了我黑色的眼睛,我用它去寻找光明
· 羊大仙向网友推送的jQuery插件赢得一致好评
焦点新闻2 时尚推荐2 技术观点2 业界报道2
· 山顶洞羊作品 jQuery 滑动切换插件横空出世
· 山顶洞,jQuery,插件
· 黑夜给了我黑色的眼睛,我用它去寻找光明
· 羊大仙向网友推送的jQuery插件赢得一致好评
焦点新闻3 时尚推荐3 技术观点 业界报道3
· 山顶洞羊作品 jQuery 滑动切换插件横空出世
· 山顶洞,jQuery,插件
· 黑夜给了我黑色的眼睛,我用它去寻找光明
· 羊大仙向网友推送的jQuery插件赢得一致好评
调用代码
$(".slideBox").switchTab({trigger: "mouseover", delayTime: 0});

7,每隔5000毫秒自动切换

焦点新闻 时尚推荐 技术观点
· 山顶洞羊作品 jQuery 滑动切换插件横空出世
· 山顶洞,jQuery,插件
· 黑夜给了我黑色的眼睛,我用它去寻找光明
调用代码
$("#switchBox7").switchTab({defaultIndex: "1", titCell: "dt span", mainCell: "dd", interTime: 5000});

8,悬停300毫秒后切换,使用fade效果

时尚推荐 焦点新闻 山顶洞 业界报道
时尚推荐
· 山顶洞羊作品 jQuery 滑动切换插件横空出世
焦点新闻
· 山顶洞,jQuery,插件
业界报道
· 羊大仙向网友推送的 jQuery 插件获得一致好评
调用代码
$("#switchBox8").switchTab({titCell: "dt a", effect: "fade", trigger: "mouseover", delayTime: 300, omitLinks: true});