ligerTab简单例子

效果图:


<html>

<head>
<meta charset="UTF-8">
<title></title>
<script type="text/javascript" src="../js/jquery.js"></script>

<script type="text/javascript" src="../js/ligerUi/ligerui.min.js"></script>
<script type="text/javascript" src="../js/ligerUi/ligerTab.js"></script>
<link rel="stylesheet" href="../css/skins/Aqua/css/ligerui-all.css" />
<script>
$(function() {
$('#tab').ligerTab({                      
//showSwitchInTab: true,
//showSwitch: true,
300,//没有该属性,但不报错
height:600,
//这个方法是选中tab后进行的操作
onAfterSelectTabItem: function(tabid)     {                
if(tabid == 'tab1') {                  //第一个div进行的操作,如数据加载
//alert(11111111111) ;         
}                   
if(tabid == 'tab2') {                   //第二个div进行的操作,如数据加载                 
// alert(22222222222) ;
}          

}
});

});
</script>
</head>

<body>
<div id="tab" >
<div title="tab1"   tabid='tab1'>
<div>1111111111111111111        </div>
</div>

<div title="tab2"   tabid='tab2'>
<div>22222222222222222      </div>
</div>

<div title="tab3"   tabid='tab3'>
<div>333333333333333333     </div>
</div>
</div>

</body>

</html>

原文地址:https://www.cnblogs.com/rdchen/p/11046362.html