时间:2017-10-12
编辑:网站制作公司
2095
1
对于我们大多数人来说,构建一个响应式布局的最困难的方面是导航的规划和编码。由于没有真正尝试和测试的通用解决方案,您使用的菜单样式将取决于您正在构建的站点的类型。
如果它是一个小站点,那么< select >下拉菜单或基本的“三行”切换菜单就足够了。但如果它是一个更大的网站(例如一个电子商务商店),它依赖于一个超级菜单来导航它的桌面版本,那么一个drawer风格的导航或者一个动画的面板菜单很可能会帮助你。
所以,不管你在构建什么类型的网站,在这个帖子里,我们希望能以这些免费的导航jQuery插件的形式为你提供解决方案。
Sidr是一个很容易使用的插件,它将创建一个响应式的facebook -a- like副菜单。它允许您在布局的任意一侧创建多个sidrs菜单。
(我们在Speckyboy上使用Sidr)。
Navgoco是一个简单的插件,它可以将一个嵌套无序的链接列表变成一个漂亮的垂直多层滑动导航,通过使用cookie和可选的手风琴菜单,可以在会话之间保留扩展的子菜单。
scrollNav是一个轻量级的jQuery插件,可以抓取页面的现有内容,将其分为逻辑部分,并构建可定制的滚动条边导航。
js允许您创建一个带有嵌套点击的时髦的响应式导航。
jVanilla菜单是一个简单的jQuery菜单插件。它需要一个现有的CSS下拉菜单,并添加一些增强功能,如动画、子菜单级别和超时延迟。
Slidebars是一个轻量级的(2kb)插件,用于创建appstyle的推菜单。
scotchPanels.js是一个jQuery的非canvas菜单和面板插件。
smartmenu是一个功能丰富的插件,它可以创建一个水平的或垂直响应的、可访问的基于列表的菜单,能在所有设备上运行。
menu - aim是一个用于下拉菜单的插件,它可以区分用户尝试在一个下拉项目上的鼠标悬停,或者试图导航到子菜单的内容。这个问题通常用超时和延迟来解决。menu- aim试图通过检测用户鼠标移动的方向来解决这个问题。这可以使您在上下菜单中导航时更快的切换。
左侧的切换菜单允许你在页面布局中添加一个侧边栏菜单,从浏览器窗口的左右边缘滑动。它可以通过移动页面,为自己腾出空间,或者通过覆盖页面。
是一个轻量级的jQuery插件,它可以在飞行中创建响应性和多层次的导航菜单。
jPanelMenu是一个jQuery插件,它创建了一个动画的泛型菜单(就像在Facebook和谷歌的移动版本中看到的类型)。动画是由支持它的浏览器的CSS转换处理的,并且在支持设备上是硬件加速的,所以动画是光滑的。
是一个插件,它允许你创建一个响应式的、嵌套的导航。
Naver是一个简单的插件,它将自动将一个基本的导航系统变成一个移动友好的系统。
是一个轻量级插件(362字节),它将< ul >和< ol >菜单转换为一个选择下拉菜单。它还自动选择当前页面,并为该项目添加选定的=“选择”。
响应菜单是一个很小的插件,当你的浏览器在移动的宽度时,它会把你的网站导航变成一个下拉(< select >)。
HorizontalNav插件将跨越一个水平导航,以适应它的容器的全部宽度,并有一个选项可以让它响应或不响应。
是一个插件,用于为你的移动网站创建光滑的应用程序外观滑动菜单,只有一行Javascript:$(“# nav”). mmenu();
MeanMenu是一个媒体查询独立插件,用于将标准菜单转换为移动响应菜单。它不是一个菜单系统的替代品,只是一些轻量级的JS将标准菜单转换成移动版本。
3
s后返回登录3
s后返回登录