亚洲国产日韩欧美一区二区三区,精品亚洲国产成人av在线,国产99视频精品免视看7,99国产精品久久久久久久成人热,欧美日韩亚洲国产综合乱

characters

Foundation 滑動(dòng)導(dǎo)航

創(chuàng)建滑動(dòng)導(dǎo)航

創(chuàng)建滑動(dòng)導(dǎo)航實(shí)例如下：

實(shí)例

<!--?最外層div：頁(yè)面布局?-->
<div?class="off-canvas-wrap"?data-offcanvas>
??<!--?內(nèi)部元素:?"工具欄"?內(nèi)容?(圖標(biāo),?鏈接,?描述內(nèi)容等)-->
??<div?class="inner-wrap">
????<nav?class="tab-bar">
??????<section?class="left-small">
????????<a?class="left-off-canvas-toggle?menu-icon"?href="#"><span></span></a>
??????</section>
??????<section?class="middle?tab-bar-section">
????????<h1?class="title">Off-canvas?Example</h1>
??????</section>
????</nav>
????<!--?滑動(dòng)菜單?-->
????<aside?class="left-off-canvas-menu">
??????<!--?Add?links?or?other?stuff?here?-->
??????<ul?class="off-canvas-list?test">
????????<li><label>Heading</label></li>
????????<li><a?href="#">Link?1</a></li>
????????<li><a?href="#">Link?2</a></li>
????????...
??????</ul>
????</aside>
????<!--?主要內(nèi)容?-->
????<section?class="main-section">
??????<h3>Lorem?Ipsum</h3>
??????<p>....</p>
????</section>
????<!--?關(guān)閉菜單?-->
????<a?class="exit-off-canvas"></a>
??</div>?<!--?結(jié)束內(nèi)部?jī)?nèi)容?-->
</div>?<!--?結(jié)束滑動(dòng)菜單?-->
<!--?初始化?Foundation?JS?-->
<script>
$(document).ready(function()?{
????$(document).foundation();
})
</script>

實(shí)例預(yù)覽 ?


關(guān)于我們 聯(lián)系我們 留言板

手冊(cè)網(wǎng)

Previous article： Next article：