欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

基于jquery的一個OutlookBar類，動態(tài)創(chuàng)建導(dǎo)航條

 更新時間：2010年11月19日 16:34:41   作者：  
初學(xué)jquery，如有錯誤，請高手們指出想看效果及完整代碼的可以下載rar包

圖示效果：

演示地址：http://demo.jb51.net/js/menu_jquery/index.html
下載地址：http://xiazai.jb51.net/201011/yuanma/menu_jquery.rar
OutlookBar.js

復(fù)制代碼 代碼如下:

function OutlookBar(targetName)//targetName:右側(cè)iframe的name
{
//創(chuàng)建標(biāo)題
this.AddTitle=function(menuid,menutitle,openor){
$("body").append("<div id="+menuid+" class='menu_down' ><span>"+menutitle+"</span></div><div id=child_"+menuid+" class='menuChild'></div><div class='jiange'></div>");
if(openor==false)
{
$("#child_"+menuid).hide();
$("#"+menuid).removeClass("menu_down");
$("#"+menuid).addClass("menu_up");
}
$("#"+menuid).click(function(){
if(openor==false){
$("#child_"+menuid).slideDown("fast");
$("#"+menuid).removeClass("menu_up");
$("#"+menuid).addClass("menu_down");
openor=true;
}
else
{
$("#child_"+menuid).slideUp("fast");
$("#"+menuid).removeClass("menu_down");
$("#"+menuid).addClass("menu_up");
openor=false;
}
})
}
//創(chuàng)建子項
this.AddItem=function(menuid,menuchildtext,childurl){
$("#child_"+menuid).append("<li><a target='"+targetName+"' href='"+childurl+"'>"+menuchildtext+"</a></li>");
}
}

使用創(chuàng)建導(dǎo)航條
復(fù)制代碼 代碼如下:

<script type="text/javascript">
$(function(){
var cc=new OutlookBar('BoardList');//targetName:右側(cè)iframe的name
cc.AddTitle('a','搜索引擎',true);//ID名，顯示名，是否打開狀態(tài)
cc.AddItem('a','百度','http://baidu.com');
cc.AddItem('a','google','http://google.com');
cc.AddTitle('b','門戶網(wǎng)站',false);
cc.AddItem('b','腳本編程','http://www.dbjr.com.cn');
cc.AddItem('b','素材','http://sc.jb51.net');
$("div").addClass("divwidth");
});
</script>

相關(guān)文章

  • JQuery解析HTML、JSON和XML實例詳解

    JQuery解析HTML、JSON和XML實例詳解

    JQuery具有強大的解析數(shù)據(jù)的能力，本文詳細(xì)介紹HTML、JSON和XML格式的文件的數(shù)據(jù)如何解析
    2014-03-03
  • JQuery點擊按鈕跳轉(zhuǎn)頁面的方法

    JQuery點擊按鈕跳轉(zhuǎn)頁面的方法

    這篇文章主要介紹了JQuery點擊按鈕跳轉(zhuǎn)頁面的實現(xiàn)方法，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教
    2022-12-12
  • jQuery 插件開發(fā) 其實很簡單

    jQuery 插件開發(fā) 其實很簡單

    jQuery已經(jīng)被廣泛使用，憑借其簡潔的API，對DOM強大的操控性，易擴展性越來越受到web開發(fā)人員的喜愛，我在社區(qū)也發(fā)布了很多的jQuery插件
    2009-07-07
  • jquery中交替點擊事件toggle方法的使用示例

    jquery中交替點擊事件toggle方法的使用示例

    jquery中交替點擊事件toggle方法中有兩個參數(shù)，分別是要交替執(zhí)行的事件。如果不傳參默認(rèn)是顯示隱藏功能，下面有個不錯的示例，感興趣的朋友可以參考下
    2013-12-12
  • jQuery使用ajaxSubmit()提交表單示例

    jQuery使用ajaxSubmit()提交表單示例

    這篇文章主要介紹了jQuery使用ajaxSubmit()提交表單示例,使用延第三方插件jquery.form實現(xiàn),需要的朋友可以參考下
    2014-04-04
  • 幾種二級聯(lián)動案例（jQuery\Array\Ajax php）

    幾種二級聯(lián)動案例（jQuery\Array\Ajax php）

    這篇文章主要為大家詳細(xì)介紹了幾種二級聯(lián)動案例（jQuery\Array\Ajax php），具有一定的參考價值，感興趣的小伙伴們可以參考一下
    2016-08-08
  • Jquery選擇器 $實現(xiàn)原理

    Jquery選擇器 $實現(xiàn)原理

    在此之前對于Microsoft Ajax的Sys和Jquery的$符號一直很好奇， 不明白為什么輸入一個'$()'就可以實現(xiàn)選擇器？
    2009-12-12
  • jquery簡單實現(xiàn)縱向的無縫滾動代碼實例

    jquery簡單實現(xiàn)縱向的無縫滾動代碼實例

    這篇文章主要介紹了jquery簡單實現(xiàn)縱向的無縫滾動，文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧
    2019-04-04
  • Jquery搜索父元素操作方法

    Jquery搜索父元素操作方法

    這篇文章主要介紹了Jquery搜索父元素操作方法,實例分析了parents、cloest、parent、parentsUtil及offsetParent方法的使用技巧,需要的朋友可以參考下
    2015-02-02
  • jquery toolbar與網(wǎng)頁浮動工具條具體實現(xiàn)代碼

    jquery toolbar與網(wǎng)頁浮動工具條具體實現(xiàn)代碼

    toolbar 網(wǎng)頁浮動工具條非常實用的一個功能，下面為大家介紹下使用jquery如何快速做到
    2014-01-01

最新評論