使用 iScroll 的锚链接在 stellar.js 视差下不起作用
anchor links not working in stellar.js parallax using iScroll
我按照下面 link 上发布的教程在网站上实现了视差,该教程使用 stellar.js
和 iScroll
移动设备:http://markdalgleish.com/2012/10/mobile-parallax-with-stellar-js/
一切看起来都不错,视差也有效,但问题是页面中的外部 links 无法在 iPad 和移动设备上打开。我使用的是 iScroll 4,所以我升级到 iScroll 5 并相应地调整了对 iScroll 5 的初始化调用。现在 links 也在这些设备中打开,但性能慢得令人难以忍受。有什么方法可以在使用 iScroll 4 时打开外部 link 或在仍然使用 iScroll 5 时提高性能?
显然 iScroll 在单击包装器内的任何元素时有一些事件处理程序。因此,我添加了代码以忽略对 select、onBeforeScrollStart
参数中的输入和文本区域的任何锚标记的点击。
为此,将 iScrollInstance = new iScroll('wrapper');
替换为以下代码:
iScrollInstance = new iScroll('wrapper', {
handleClick: true,
onBeforeScrollStart: function (e) {
var target = e.target;
if (target.tagName != 'A' && target.tagName != 'SELECT' && target.tagName != 'INPUT' && target.tagName != 'TEXTAREA')
e.preventDefault();
}
});
我按照下面 link 上发布的教程在网站上实现了视差,该教程使用 stellar.js
和 iScroll
移动设备:http://markdalgleish.com/2012/10/mobile-parallax-with-stellar-js/
一切看起来都不错,视差也有效,但问题是页面中的外部 links 无法在 iPad 和移动设备上打开。我使用的是 iScroll 4,所以我升级到 iScroll 5 并相应地调整了对 iScroll 5 的初始化调用。现在 links 也在这些设备中打开,但性能慢得令人难以忍受。有什么方法可以在使用 iScroll 4 时打开外部 link 或在仍然使用 iScroll 5 时提高性能?
显然 iScroll 在单击包装器内的任何元素时有一些事件处理程序。因此,我添加了代码以忽略对 select、onBeforeScrollStart
参数中的输入和文本区域的任何锚标记的点击。
为此,将 iScrollInstance = new iScroll('wrapper');
替换为以下代码:
iScrollInstance = new iScroll('wrapper', {
handleClick: true,
onBeforeScrollStart: function (e) {
var target = e.target;
if (target.tagName != 'A' && target.tagName != 'SELECT' && target.tagName != 'INPUT' && target.tagName != 'TEXTAREA')
e.preventDefault();
}
});