在单个页面中,我只包含 jQuery 3.1.1 和 stellar.js对于视差滚动效果,但是当我尝试将其用作 $(window).stellar();
时,我在控制台中收到此错误:
Uncaught TypeError: f.getClientRects is not a function (jquery-3.1.1.min.js:4)
我尝试按照许多答案中的建议使用 migrate 插件,但没有解决我的问题。
该片段只是为了向您展示错误。
$(function(){
$('.main').stellar();
});
<div class="main">
<div class="slide"></div>
<div class="slide"></div>
<div class="slide"></div>
</div>
<script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/stellar.js/0.6.2/jquery.stellar.min.js"></script>
最佳答案
stellar.js 由于这段代码而失败:
$(window).load(function() {
var oldLeft = self._getScrollLeft(),
oldTop = self._getScrollTop();
self._setScrollLeft(oldLeft + 1);
self._setScrollTop(oldTop + 1);
self._setScrollLeft(oldLeft);
self._setScrollTop(oldTop);
});
在 jquery 3.0 中,加载事件被移除。您可以更改为 on('load', function{});
$(window).on('load', function() {
var oldLeft = self._getScrollLeft(),
oldTop = self._getScrollTop();
self._setScrollLeft(oldLeft + 1);
self._setScrollTop(oldTop + 1);
self._setScrollLeft(oldLeft);
self._setScrollTop(oldTop);
});
这是一个“工作” fiddle :https://jsfiddle.net/y19x160g/1/通过工作,我只是说这不再引发错误。
P.S:我不知道这个库到底是干什么用的。
在那个 js fiddle 中,我刚刚从当前 GitHub 项目复制了未缩小的脚本:https://github.com/markdalgleish/stellar.js/blob/master/src/jquery.stellar.js 并修改了加载事件。
其他引用:https://api.jquery.com/load-event/ - 参见弃用
关于javascript - 使用带有 jquery 3.1.1 的 stellar.js 未捕获的 TypeError,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/39752221/