100字范文,内容丰富有趣,生活中的好帮手!
100字范文 > 基于Jquery的简单&简陋Tabs插件代码

基于Jquery的简单&简陋Tabs插件代码

时间:2020-02-12 07:01:24

相关推荐

基于Jquery的简单&简陋Tabs插件代码

清醒时做事,糊涂时读书,大怒时睡觉,无聊时关注为大家准备的精彩内容。下面为大家推荐基于Jquery的简单&简陋Tabs插件代码,无聊中的都看过来。

HTML代码

代码如下:

div

li 1/li

li2/li

li3/li

/div

div

div第一个/div

div第二个/div

div第三个/div

/div

Jquery

代码如下:

$().PPXTabs({ nav:.tab li,nav_txt:.tab_box div,selectedClass:selected,hoverClass:hover});

代码

代码如下:

/*================================================================

*Copyright PPX

*邮箱:[email protected]

*原始版本作者:PPX 创建时间:-2-8 10:20

*================================================================

*参数说明

*param name="nav"导航列/param

*param name="nav_txt"导航内容/param

*param name="selectedClass"选中时的样式/param

*param name="hoverClass"经过时的样式/param

*

*默认为

*$().PPXTabs({

nav:.news_title1 li,

nav_txt:.news_list_box div,

selectedClass: ab_1_A,

hoverClass: ab_1_B

});

===================================

Demo

-----

div

li 1/li

li2/li

li3/li

/div

div

div第一个/div

div第二个/div

div第三个/div

/div

===================================

css

-----

$().PPXTabs({ nav:.tab li,nav_txt:.tab_box div,selectedClass:selected,hoverClass:hover});

*/

$.(){

//默认配置

var settings={

nav:.news_title1 li,

nav_txt:.news_list_box div,

selectedClass: ab_1_A,

hoverClass: ab_1_B

};

//主函数

$(function(){

var tab_menu_li = $(settings.nav);

$(+()).hide();

(function(){

//鼠标移入

$(this).removeClass();

$(this).siblings().find("."+).removeClass();

$(this).siblings("li").addClass();

$(this).addClass();

var index = ();

$().eq(index).show().siblings().hide();

},function(){

//鼠标移出

$(this).removeClass();

$(this).siblings().find("."+).removeClass();

$(this).siblings("li").addClass();

$(this).addClass();

});

});

if(options){

$.extend(settings,options);

}

};

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。