添加paralax滚动时未定义Javascript $窗口

Question

我目前正在构建一个基于时间线的页面,其中包含不同的年份,因为这是一个包含大量信息的单页,我决定使用可用的paralax滚动效果,构建我的页面以下列方式工作:

我已根据本教程添加了paralax scrolling .但它不能按我想要的方式运作.

我创造了这个小提琴,试图展示我想要它做什么.

我使用与教程中相同的JS:

 $(document).ready(function () {
        $('section[data-type="background"]').each(function () {
            var $bgobj = $(this); // assigning the object

            $(window).scroll(function () {
                var yPos = -($window.scrollTop() / $bgobj.data('speed'));

                // Put together our final background position
                var coords = '50% ' + yPos + 'px';

                // Move the background
                $bgobj.css({ backgroundPosition: coords });
            });
        });
    });

但滚动页面时继续收到以下消息:Uncaught ReferenceError:$ window未定义任何建议或帮助将不胜感激.

Answer 1

纠正$window到$(window)