DWZ组件
navTab鏈接擴展
<a href=”xxx” target=“navTab” [rel=“tabId”]>
示例:
<a?href="url"?target="navTab"?>默認頁面</a>
<a?href="url"?target="navTab"?rel="page1"?title="自定義標簽名"?fresh="false">自定義頁面</a>
<a?href="url"?target="navTab"?external="true">iframe方式打開</a>
target=navTab: 自動關聯調用navTab組件
rel: 為navtab的ID值，后續可以用來重載該頁面時使用，如當前頁新增或刪除數據可以通過該ID進行通知JS重載。注意rel的值區分大小寫.
fresh: 表示重復打開navTab時是否重新加載數據
external: 為external="true"或者href是外網連接時，以iframe方式打開navTab頁面
Js調用
navTab.openTab(tabid,?url, { title:”New Tab”,?fresh:false, data:{} });
其中data:{} json格式的數據
Tab組件擴展
開發人員不需寫任何javacsript, 只要使用下面的html結構就可以.
<div?class="tabs">
????? <div?class="tabsHeader">
??????????? <div?class="tabsHeaderContent">
????????????????? <ul>
??????????????????????? <li?class="selected"><a?href="#"><span>標題1</span></a></li>
??????????????????????? <li><a?href="#"><span>標題2</span></a></li>
????????????????? </ul>
??????????? </div>
????? </div>
????? <div?class="tabsContent"?style="height:150px;">
??????????? <div>內容1</div>
??????????? <div>內容2</div>
????? </div>
????? <div?class="tabsFooter">
??????????? <div?class="tabsFooterContent"></div>
????? </div>
</div>
Accordion組件
<div?class="accordion"?[fillSpace=”xxxKey”]>
????? <div?class="accordionHeader">
??????????? <h2><span>icon</span>面板1</h2>
????? </div>
????? <div?class="accordionContent"?style="height:200px">
??????????? 內容1
????? </div>
????? <div?class="accordionHeader">
??????????? <h2><span>icon</span>面板2</h2>
????? </div>
????? <div?class="accordionContent">
??????????? 內容2
????? </div>
????? <div?class="accordionHeader">
??????????? <h2><span>icon</span>面板3</h2>
????? </div>
????? <div?class="accordionContent">
??????????? 內容3
????? </div>
</div>
容器高度自適應
容器高度自適應, 只要增加擴展屬性layoutH=”xx”, 單位是像素.
LayoutH表示容器內工具欄高度.? 瀏覽器窗口大小改變時容器高度自適應, 但容器內工具欄高度是固定的, 需要告訴js工具欄高度來計算出內容的高度.
示例:
<div class=”layoutBox”>
<div layoutH=“150”>內容</div>
</div>
注意：?layoutH=“150”的高度是根據含有class=”layoutBox”的父容器div動態更新的
?
總結
