HTML5中国

 找回密码
 立即注册

QQ登录

只需一步,快速开始

HTML5中国 首页 应用推荐 HTML5应用 查看内容

轻量级跨平台的jQuery响应式导航菜单插件

2015-11-11 13:45| 发布者: html5cn| 查看: 1970| 评论: 0|来自: jQuery之家

摘要: Trunk.js是一款非常实用的轻量级响应式跨平台的jQuery导航菜单插件。该插件会根据viewport的大小来重置导航菜单。在大屏幕设备中,导航菜单以常规的水平菜单展示,在移动手机等小屏幕设备中,它会将菜单转换为侧边栏 ...

  简要教程

  Trunk.js是一款非常实用的轻量级响应式跨平台的jQuery导航菜单插件。该插件会根据viewport的大小来重置导航菜单。在大屏幕设备中,导航菜单以常规的水平菜单展示,在移动手机等小屏幕设备中,它会将菜单转换为侧边栏隐藏菜单。

 

查看演示      下载插件

 

  使用方法

  使用该响应式导航菜单插件需要引入jQuery、trunk.js和trunk.css文件。



              


  HTML结构

  在移动手机等小屏幕设置中,默认只会在头部显示一个汉堡包图标,它的HTML结构如下:


  导航菜单的HTML结构如下:


  整个页面的HTML结构如下:

  • HEADER

  • BODY

  按照上面的HTML结构,即可构建出一个带响应式导航菜单的布局。

 

   来源jQuery之家

更多

鲜花

握手

雷人

路过

鸡蛋

相关阅读

最新评论

HTML5中国微信

小黑屋|关于我们|HTML5论坛|友情链接|手机版|HTML5中国 ( 京ICP备11006447号 京公网安备:11010802018489号  

GMT+8, 2017-6-27 08:11

Powered by Discuz! X3.2

© 2001-2013 Comsenz Inc.

返回顶部