當(dāng)前位置:首頁 > 新聞中心 > 解決方案
深圳網(wǎng)站建設(shè)分享：實用的jQuery導(dǎo)航菜單插件責(zé)任編輯 :李飛    文章來源 :星翼創(chuàng)想(16qt59sf.cn)    發(fā)布時間 :2015-11-10    閱讀次數(shù):3364

Trunk.js是一款非常實用的輕量級響應(yīng)式跨平臺的jQuery導(dǎo)航菜單插件。該插件會根據(jù)viewport的大小來重置導(dǎo)航菜單。在大屏幕設(shè)備中，導(dǎo)航菜單以常規(guī)的水平菜單展示，在移動手機等小屏幕設(shè)備中，它會將菜單轉(zhuǎn)換為側(cè)邊欄隱藏菜單。


使用方法

使用該響應(yīng)式導(dǎo)航菜單插件需要引入jQuery、trunk.js和trunk.css文件。

<link rel="stylesheet" href="css/trunk.css">
<script src="http://code.jquery.com/jquery-1.11.3.min.js"></script>
<script src="js/trunk.js"></script>               
HTML結(jié)構(gòu)

在移動手機等小屏幕設(shè)置中，默認只會在頭部顯示一個漢堡包圖標，它的HTML結(jié)構(gòu)如下：

<header class="slide">
  <ul id="navToggle" class="burger slide">
    <li></li><li></li><li></li>
  </ul>
</header>             

導(dǎo)航菜單的HTML結(jié)構(gòu)如下：
<nav class="slide">
  <ul>
    <li><a href="#" class="active">HOME</a></li>
    <li文章轉(zhuǎn)載請保留網(wǎng)址：http://16qt59sf.cn/news/solutions/1539.html

上一篇：深圳網(wǎng)站建設(shè)分享：利用Google Analytics做好網(wǎng)站數(shù)據(jù)分析

下一篇：關(guān)于“知乎”的這些，你知道嗎？

深圳市星翼創(chuàng)想網(wǎng)絡(luò)科技有限公司
廣東省深圳市羅湖區(qū)和平路3001號鴻隆世紀廣場B座13G
郵政編碼：518000
電話: 0755-82685986/82685936
微信: 159-8667-8737（微信同號）
郵箱: market@iswweb.com
傳真: 0755-82685820
微信小程序開發(fā)


加微信即時溝通

深圳市星翼創(chuàng)想網(wǎng)絡(luò)科技有限公司 版權(quán)所有
粵ICP備10210107號 Copyright © 2010-2024 All Rights Reserved.