BR> "http://www.w3.org/TR/html4/loose.dtd"> ;
標籤外掛程式製作
*{margin: 0;padding: 0}
.tab{width: 350px;margin: 100px auto;}
;margin: 100px auto;}
. 80px；邊框：1px 實心#ccc；邊框半徑：5px；右邊距：5px；高度：24px；行高：24px；文字對齊：居中；}
.tabnav li.cur{背景：#daa520}
.tabcontent{顯示：無；填入：20px;}
.tabcon{邊框：1px #708090 實心；背景：#ffc0cb；高度：300px；清楚：兩者；}
🎜>
<script><BR> (function($){<BR> $.fn.extend({<BR> var confings={<BR> tabNav:'',//tab導覽名稱<BR> tabCon:'',//標籤內容名稱<BR> 其他類別名稱<BR> 為的點選式「//滑鼠事件狀態<BR> ;//默认设置<BR> options= $.extend(confings,options);<BR> var that=$(this);<BR> var tagnav=$(confings.tabNav);<BR> var tabLi=tagnav.find(confings.tabTag);<BR> var tabcon=$(confings.tabCon);<BR> var tabUl=tabcon.find(confings.conTag);<BR> var timoutid=null;<BR> tabLi.each(function(ind){<BR> $(this).bind(options.method,function(){<BR> var liNode = $(this);<BR> timoutid = setTimeout(function(){ //鼠标不小心划过的延迟时间<BR> tabUl.hide();<BR> tabLi.removeClass("cur");<BR> tabUl.eq(ind).show();<BR> liNode.addClass("cur");<BR> },300);<BR> }).mouseout(function(){<BR> clearTimeout(timoutid);<BR> });<br><br> })<BR> return this;<BR> }<BR> })<br><br> })(jQuery);<BR> $(function(){<br><br> $("#testtab5").myTab({<BR> tabNav:"#tabtag5",tabTag:"li",tabCon:"#tabcon5",conTag:".tabcontent",method:"mouseover"<BR> });<BR> $("#testtab").myTab({<BR> tabNav:"#tabtag",tabTag:"li",tabCon:"#tabcon",conTag:".tabcontent"<BR> });<br><br> })<BR> </script>
Content one
Content 2
div style="clear: both;margin-top: 60px;"> ">
" /li>
;Menu 3
Content 1
">Content three
