- iOS/Objective-C 元类和类别
- objective-c - -1001 错误,当 NSURLSession 通过 httpproxy 和/etc/hosts
- java - 使用网络类获取 url 地址
- ios - 推送通知中不播放声音
我正在使用 fullPage.js
JQuery 插件(参见演示 here)。该插件定义了全窗口大小的部分,并在用户向上或向下滚动时从“幻灯片”部分滚动到“幻灯片”部分。
我正在尝试修改它,以便滚动事件不会在滚动开始时立即触发,而是在短时间或一定的滚动量后触发,以防止用户意外滑动几个像素,这将触发滚动事件并滚动到下一张幻灯片。
例如,如果用户滚动 offset < 100px,然后滚动回当前幻灯片,如果 offset > 100px,则滚动到下一张幻灯片。
Here是 fullpage.js
代码。我认为我将不得不修改此功能以获得我想要的:
//when scrolling...
$(window).scroll(function(e){
if(!options.autoScrolling){
var currentScroll = $(window).scrollTop();
var scrolledSections = $('.section').map(function(){
if ($(this).offset().top < (currentScroll + 100)){
return $(this);
}
});
//geting the last one, the current one on the screen
var currentSection = scrolledSections[scrolledSections.length-1];
//executing only once the first time we reach the section
if(!currentSection.hasClass('active')){
var yMovement = getYmovement(currentSection);
$('.section.active').removeClass('active');
currentSection.addClass('active');
var anchorLink = currentSection.data('anchor');
$.isFunction( options.onLeave ) && options.onLeave.call( this, currentSection.index('.section'), yMovement);
$.isFunction( options.afterLoad ) && options.afterLoad.call( this, anchorLink, (currentSection.index('.section') + 1));
activateMenuElement(anchorLink);
}
}
});
但我真的不知道该怎么做...我想我应该在滚动开始和滚动结束时获得滚动偏移量/时间,获得差异,然后根据差异滚动到当前或下一张幻灯片,但我不知道如何在此函数中实现它以及如何获得滚动结束事件。
而且我不确定是否使用“滚动结束事件”,因为如果用户想要向下或向上滚动,脚本不必等待用户停止滚动以滚动到它必须滚动的位置..
也许我应该在滚动期间获得滚动偏移量,当 offset > x 时滚动到下一个,如果滚动停止且 offset < x 则滚动回当前?或者我可以使用滚动时间而不是滚动偏移量?
最佳答案
我想您遇到的问题是笔记本电脑及其触控板,而不是鼠标滚轮。我对么?或者,使用 Apple 鼠标,它在滚动方面就像触控板。
好吧,只是想让你知道,问题不在 $(window).scroll(function(e){
函数中,而是在 MouseWheelHandler()
. .scroll
函数仅在选项 autoScrolling
设置为 false
时使用,如您在第一个条件中所见。
也就是说,MouseWheelHandler()
函数在每次检测到鼠标滚轮或触控板上的任何滚动时都会触发。避免在第一次滚动时触发它的方法就是为它创建一个计数器。
您必须小心,因为触控板的滚动比普通鼠标滚轮的滚动敏感得多,因此,在定义您要使用的最小滚动次数之前,先在两种设备上尝试一下。
我定义了一个设置为 0 的新变量:
var scrolls = 0;
然后,在 MouseWheelHandler()
中,我添加了一个新条件 scrolls > 2
。
if(options.autoScrolling && scrolls>2){
这样,我们只会在滚动超过 3 次时触发事件,我相信这对于鼠标滚轮来说已经足够了。
如果我们不输入条件,那么我们增加变量:
}else{
scrolls++;
};
这是工作演示:http://jsfiddle.net/prYUq/2/
这里是完整的修改函数:
var scrolls = 0;
function MouseWheelHandler() {
return function (e) {
if (options.autoScrolling && scrolls > 2) {
// cross-browser wheel delta
e = window.event || e;
var delta = Math.max(-1, Math.min(1, (e.wheelDelta || -e.detail)));
e.wheelData
console.log("e.wheelDelta: " + e.wheelDelta);
console.log("-e.detail: " + e.detail);
if (!isMoving) { //if theres any #
var scrollable = $('.section.active').find('.scrollable');
//scrolling down?
if (delta < 0) {
if (scrollable.length > 0) {
//is the scrollbar at the end of the scroll?
if (isScrolled('bottom', scrollable)) {
$.fn.fullpage.moveSlideDown();
} else {
return true; //normal scroll
}
} else {
$.fn.fullpage.moveSlideDown();
}
}
//scrolling up?
else {
if (scrollable.length > 0) {
//is the scrollbar at the start of the scroll?
if (isScrolled('top', scrollable)) {
$.fn.fullpage.moveSlideUp();
} else {
return true; //normal scroll
}
} else {
$.fn.fullpage.moveSlideUp();
}
}
}
scrolls = 0;
return false;
} else {
scrolls++;
};
}
}
如果您对插件有具体问题或要求,请不要忘记 github 上有关此插件的问题论坛:https://github.com/alvarotrigo/fullPage.js/issues?state=open
希望对你有帮助。
关于javascript - 在一定的滚动偏移量或滚动时间后触发滚动事件,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/19513065/
我正在尝试从第 4 到 9 页以及第 12 和 13 页上的单元格中清除所有内容(包括图像)。我有以下代码,但它正在清除第 3-9 和 12-15 页中的内容,我不知道为什么。 有什么想法吗? Sub
有没有办法增加极坐标图刻度标签(θ)的填充/偏移? import matplotlib import numpy as np from matplotlib.pyplot import figure,
我正在调用本地 API 并尝试以分页 样式进行操作。我有 n 张图片,我想将它们分成 n/4 行(每行 4 张图片)。因此,我正在调用我的 API,images/count,offset。但不知何故,
我的问题解释起来有点棘手,但无论如何我都会尝试。我有两个水平选项卡,当您单击它们时,会打开一个文本框内容。当他们被点击时,我试图“关注”他们。我在网上找到了很多资料,但除了我在下面显示的这段代码外,没
所以我有一个 float 的 div,我需要它始终向右 200 像素,并填充窗口的其余部分。有没有某种跨浏览器兼容的方法,我可以在不借助 javascript 的情况下使宽度填满页面的其余部分? 最佳
我有以下片段 $('html,body').animate({scrollTop: $('#menu').offset().top}, 'slow'); 单击链接时,我希望浏览器从#menu div
我目前正在为我的应用程序使用 JASidePanel,并且我有一个 UITableViewcontroller 和一个 UIRefreshControl 作为它的 ViewController 之一。
给出以下代码: imshow(np.arange(16*16).reshape(16,16)) cb = colorbar() cb.set_label("Foo") cb.set_ticks([0,
我是编程新手,我认为 VBA 是一个很好的起点,因为我在 Excel 中做了很多工作。 我创建了一个宏,它从输入框中获取一个整数(我一直使用 2、3 和 4 来测试),并创建该数字的一组 4 层层次结
我在 PHP 中有一个 unix 时间戳: $timestamp = 1346300336; 然后我有一个我想要应用的时区的偏移量。基本上,我想应用偏移量并返回一个新的 unix 时间戳。偏移量遵循这
演示:http://jsfiddle.net/H45uY/6/ 我在这里想做的是将 的左上角设为跟随鼠标。代码在没有段落的情况下工作正常(请参阅上面的演示),但是当您添加段落时,被向上推,鼠标位于盒
假设我们有两个由无符号长(64 位)数组表示的位图。我想使用特定的移位(偏移)合并这两个位图。例如,将位图 1(较大)合并到位图 2(较小)中,起始偏移量为 3。偏移量 3 表示位图 1 的第 3 位
通过在 pageViewController 中实现 tableView,tableView 与其显示的内容不一致。对此最好的解决办法是什么? 最佳答案 如果您的 TableView 是 View C
我设置了一个在 nib 中显示地点信息的地点配置文件。当我在标准屏幕流程中推送此 View 时,它工作正常。但是,当我从另一个选项卡推送此 View 时,UINavigationBar 似乎抵消了它,
如果我想选择 5 条记录,我会这样做: SELECT * FROM mytable LIMIT 5 如果我想添加偏移量,我会这样做: SELECT * FROM mytable OFFSET 5 LI
我有一个应用程序,其中某些 View 需要全屏,而其他 View 不需要全屏。在某些情况下,我希望背景显示在状态栏下方,所以我在 View 加载时使用它来使 Activity 全屏显示: window
在下图中,我进行绘制,结果位于 A 点,就在我手指接触的地方。 如何使图像显示在实际触摸上方约 40pt。 (二) 我正在使用经典的 coreGraphic UITouch 代码,如下所示: - (v
只要键盘处于事件状态,我就会尝试偏移 UITextField,效果很好,直到我尝试了表情符号布局。有没有办法检测键盘输入的类型,以便找出高度差?谢谢 最佳答案 不是使用 UIKeyboardDidSh
这是我的 Swift 代码 (AppDelegate.swift): var window: UIWindow? var rootViewController :UIViewController? f
我有一个 div 作为绝对定位的 body 的直接子节点,其 css 属性定义如下: div[id^="Container"] { display: block; position: a
我是一名优秀的程序员,十分优秀!