탐색 bar_jquery를 동적으로 생성하기 위한 jquery 기반 OutlookBar 클래스

일러스트 효과:

데모 주소: 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 이름
{
//제목 생성
이것입니다. AddTitle=function(menuid ,menutitle,openor){
$("body").append("

" menutitle "

");
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;
}
})
}
//하위 생성 item
this.AddItem=function(menuid,menuchildtext,childurl){
$("#child_" menuid).append("

" menuchildtext "

")
}
}

을 사용하여 탐색 모음 만들기코드 복사 코드는 다음과 같습니다.