Maison > interface Web > js tutoriel > 基于jquery的一个OutlookBar类,动态创建导航条_jquery

基于jquery的一个OutlookBar类,动态创建导航条_jquery

WBOY
Libérer: 2016-05-16 18:16:04
original
1556 Les gens l'ont consulté

图示效果:
基于jquery的一个OutlookBar类,动态创建导航条_jquery
演示地址:http://demo.jb51.net/js/menu_jquery/index.html
下载地址:http://xiazai.jb51.net/201011/yuanma/menu_jquery.rar
OutlookBar.js

复制代码 代码如下:

function OutlookBar(targetName)//targetName:右侧iframe的name
{
//创建标题
this.AddTitle=function(menuid,menutitle,openor){
$("body").append("
");
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;
}
})
}
//创建子项
this.AddItem=function(menuid,menuchildtext,childurl){
$("#child_"+menuid).append("
  • "+menuchildtext+"
  • ");
    }
    }

    使用创建导航条
    复制代码 代码如下:


    Étiquettes associées:
    source:php.cn
    Déclaration de ce site Web
    Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
    Tutoriels populaires
    Plus>
    Derniers téléchargements
    Plus>
    effets Web
    Code source du site Web
    Matériel du site Web
    Modèle frontal