mui div 選項卡tab 使用簡析

<nav class="mui-bar mui-bar-tab">
            <a class="mui-tab-item mui-active" href="#tabbar">  //鏈接到id="tabbar"的地方,顯示id="tabbar"的div塊中調用的內容,可以說本地內容,如examples/about.html,也可以是網絡內容,如http://www.sina.com.cn
                <span class="mui-icon mui-icon-home"></span>
                <span class="mui-tab-label">巡課管理</span>
            </a>
            <a class="mui-tab-item" href="#tabbar-with-chat">
                <span class="mui-icon mui-icon-email"></span>
                <span class="mui-tab-label">巡課反饋</span>
            </a>
            <!-- <a class="mui-tab-item" href="#tabbar-with-contact">
                <span class="mui-icon mui-icon-contact"></span>
                <span class="mui-tab-label">通訊錄</span>
            </a>-->
            <a class="mui-tab-item" href="#tabbar-with-map">
                <span class="mui-icon mui-icon-gear"></span>
                <span class="mui-tab-label">我的</span>
            </a> 
        </nav>
        <div class="mui-content">
            
            
             <div id="tabbar" class="mui-control-content mui-active">
                <div class="title"><iframe src="http://58.218.149.207:8085/e/DoInfo/AddInfo.php?mid=13&enews=MAddInfo&classid=88&Submit=%E6%B7%BB%E5%8A%A0%E4%BF%A1%E6%81%AF"  width="100%" height="800px"></iframe></div>  //此處嵌入網絡內容

            </div>

這種方式調用網頁可以實現選項卡的切換效果,用subpage待議

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章