3

私は現在、さまざまな年の時系列ベースのページを作成しています。これは多くの情報を含む単一のページであるため、次の方法で動作するようにページを作成するために、利用可能な視差スクロール効果を使用することにしました。

ここに画像の説明を入力

このチュートリアルに基づいて視差スクロールを追加しました。しかし、それは私が望むようには機能しません。

私はこのFiddleを作成して、私がやりたいことを試して実証しました。

チュートリアルと同じ 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 is not definedアドバイスや支援をいただければ幸いです。

4

3 に答える 3

3

.scroll の外で新しい変数を宣言できます

...
var $window = $(window);
$window.scroll(function () {
...

(.scroll$window内で変数を使用しているため)

于 2013-05-23T07:20:53.327 に答える