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,
            width : 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>

 

posted @ 2019-06-18 17:18  爱跳舞的程序员  阅读(921)  评论(0编辑  收藏  举报