jquery单页网站导航插件One Page Nav
这是一个轻量级的jQuery的单页网站导航插件。增加了单击后平滑滚动导航和当你浏览不同的部分时自动选择正确的导航项。
changeHash: false, 改变当用户单击导航,就改变changeHash选项为true。
scrollSpeed: 750,
scrollThreshold: 0.5,
filter: '',
easing: 'swing',
begin: function() { //I get fired when the animation is starting },
end: function() { //I get fired when the animation is ending },
scrollChange: function($currentListItem) { //I get fired when you enter a section and I pass the list item of the section } });
在项目中选择一个导航→传入一个选择器过滤选项。
选择到该导航,调用onePageNav();
$('#nav').onePageNav(
filter: ':not(.external)'
});
如果你在iOS设备上单击链接导航导致 其他链接断掉,你可以通过滚动操作来解决这个问题
$('#nav').onePageNav({
begin: function() {
//Hack so you can click other menu items after the initial click
$('body').append('<div id="device-dummy" style="height: 1px;"></div>');
},end: function() {
$('#device-dummy').remove();
}
});
jquery单页网站导航插件One Page Nav的更多相关文章
- Fixed Responsive Nav – 响应式的单页网站导航插件
Fixed Responsive Nav 是一个响应式的,固定的,触摸友好的单页网站导航插件,响应式导航,流畅的动画滚动.该项目采用渐进增强构建,支持工作在 IE6 及以上版本的浏览器. 你可以给导航 ...
- Smint – 用于单页网站制作的 jQuery 导航菜单插件
Smint 是一款用于实现单页风格网站的 jQuery 导航插件,包含两部分:固定在页面顶部的精美导航条和能够在你点击的时候自动滚动到对应内容的菜单按钮.Smint 使用非常简单,只有一个参数用于设置 ...
- 拥抱单页网站! jQuery全屏滚动插件fullPage.js
不知道从什么时候开始,单页网站就悄悄走进人们的视线,尤其是国外的网站,更是钟爱单页网站.制作一个全屏滚动的效果,然后每个滚动页弄一个好看的背景色,配上一些描述性的文字,大家都喜欢这么弄,仿佛逼格瞬间可 ...
- FullPage.js – 轻松实现全屏滚动(单页网站)效果
FullPage.js 是一个简单而易于使用的插件,用来创建全屏滚动网站(也被称为单页网站).除了可以创建全屏滚动效果以外,也可以给网站添加一些水平的滑块效果.能够自适应不同的屏幕尺寸,包括平板电脑和 ...
- 你应该知道的10个奇特的 HTML5 单页网站
网页设计师努力寻找新的方式来展现内容.其中一个大的趋势是单页网站,现在被世界上的一些大的品牌广泛采用,使用它们来为用户提供一个快速,干净和简单的而且美丽的网站. 下面是10个令人惊叹的单页 H ...
- 精品素材:WALK & RIDE 单页网站模板下载
今天,很高兴能向大家分享一个响应式的,简约风格的 HTML5 单页网站模板.Walk & Ride 这款单页网站模板是现代风格的网页模板,简洁干净,像素完美,特别适合用于推广移动 APP 应用 ...
- HTML5网站大观:15个精美的 HTML5 单页网站作品欣赏
HTML5 是现在Web开发领域的热点,更多的开发人员开始使用HTML5来开发交互性强.效果出众的Web应用和游戏.今天,本文收集了15个精美的 HTML5 单页网站作品,让大家感受一下 HTML5 ...
- AnjularJs的增删改查(单页网站)
2016.6.4 学习文献: 你的第一个AngularJS应用:https://segmentfault.com/a/1190000000347412 AngularJS 提交表单的方式:http:/ ...
- SMINT:单页网站的免費jQuery插件
最近为了做一个静态网页版的数据报告,不希望花很多时间去设计网页,或者花时间去调整布局,于是找到了一个名为Smint的免費jQuery插件.几乎不需要写什么代码就可以完成一个一页式网站.这非常适合用来制 ...
随机推荐
- wordpress All in one Seo
原文地址:http://www.7adesign.com/155.html WordPress插件All-in-one-seo-pack详细设置: I enjoy this plugin and ha ...
- 2.4 statistical decision theory
在讲完最小二乘(linear regression)和K近邻后,进入本节. 引入符号: $X\in R^p$ X为维度为p的输入向量 $Y\in R$ Y为输出,实数 $P(X,Y)$ 为两者的联合概 ...
- linux守护进程解读
Linux系统守护进程详解 不要关闭下面这几个服务: acpid, haldaemon, messagebus, klogd, network, syslogd 1. NetworkManag ...
- 【学习总结】autostart 与 init
学习总结/etc/xdg/autostart/xxx.desktop,是开机从登录界面跳转到桌面启动的,可以拿到桌面环境变量,用户id是“普通用户”,如果自启动的程序文件所属者为root,则需要 执行 ...
- flume【源码分析】分析Flume的拦截器
h2 { color: #fff; background-color: #7CCD7C; padding: 3px; margin: 10px 0px } h3 { color: #fff; back ...
- 后缀数组da3模板
在做poj2406的时候...按论文给的rmq模板会超内存...然后网上找了http://blog.csdn.net/libin56842/article/details/46310425这位大爷的d ...
- 项目中常用方法总结(将将DataTable数据集映射到实体对象)【转】
本篇把项目中用到的一些通用方法总结出来, 这些方法因为经常需要在项目中用到,所以把它们归纳在一起, 形成一个.dll 文件是一个理想的选择. 这样也便于日后缩短开发周期. 一. 把一个DataGrid ...
- Chrome for Android在Chromium代码库中的提交patch
訪问这个地址: https://codereview.chromium.org/1141283003 主要分为3类:png资源文件.java代码.C++代码,曾经以为这部分不开源的代码主要是C++,事 ...
- 【简单项目框架一】Fragment实现的底部导航
流行的应用的导航一般分为两种,一种是底部导航,一种是侧边栏. 我所做的项目涉及到比较多的是底部导航,今天我就把项目中使用的一种实现方式分享一下. 主要实现思路是:在一个Activity里面底部添加四个 ...
- 依赖注入及AOP简述(四)——“好莱坞原则”和依赖注入框架简介 .
3.2. “好莱坞原则” 看了前面关于依赖注入概念的描述,我们来提炼出依赖注入的核心思想.如果说传统的组件间耦合方式,例如new.工厂模式等,是一种由开发者主动去构建依赖对象的话,那么依赖注入模 ...