基于JQuery的Tab滑动门插件实现代码

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js" type="text/javascript"></script>
<script>
/***
* anthor: Mao wl
* switch control Plug-in
*
* based on Jquery
* 
demo:
$('#switchWrap').switchControl({
slideSpeed: 300, //content cutover speed
controlTo: $('#contentWrape'), //be controlled wrap
contentDefaultNum: 0, //default content number, start from 0
checkRevertDefault_interval: 600 //the interval revert to default content while cursor not hover on switchWrap or contentWrape
});
*
**/
(function(a){a.fn.switchControl=function(c){var e=a.extend({},{slideSpeed:300,controlTo:{},contentDefaultNum:0,checkRevertDefault_interval:1500},c);var b={t:""};var f=function(h){var i=0;a.each(h.prevAll(),function(){i+=a(this).width()});a("#switchControlWrap").animate({left:-i},e.slideSpeed)};var g=function(h,i){if(!h.hasClass("hover")&&!e.controlTo.hasClass("hover")){f(i)}};var d=function(h){var i=a("#switchControlWrap").children().eq(h);var j=0;a.each(i.prevAll(),function(){j+=a(this).width()});a("#switchControlWrap").animate({left:-j},e.slideSpeed)};return a(this).each(function(){var i=a(this);var h=0;var j=0;a.each(e.controlTo.children(),function(){if(a(this).height()>j){j=a(this).height()}h+=a(this).width()});e.controlTo.children().wrapAll("<div id='switchControlWrap' style='position:absolute; width:"+h+"; height:"+j+"'></div>");var k=a("#switchControlWrap").children().eq(e.contentDefaultNum);a("#switchControlWrap").append(k);f(k);i.hover(function(){a(this).addClass("hover")},function(){a(this).removeClass("hover");clearTimeout(b.t);b.t=setTimeout(function(){g(i,k)},e.checkRevertDefault_interval)});e.controlTo.hover(function(){a(this).addClass("hover")},function(){a(this).removeClass("hover");clearTimeout(b.t);b.t=setTimeout(function(){g(i,k)},e.checkRevertDefault_interval)});a.each(i.children(),function(){a(this).click(function(){var l=a(this).index();d(l)})});g(i,k)})}})(jQuery);
</script>

<style type="text/css">
#switchWrap{
list-style:none;
}

.switch{
width:90px;
height:20px;
background-color:#000;
color:#FFF;