我正在关注这个，但似乎无法让它工作答案

【问题标题】：I am following this but cant seem to get it to work我正在关注这个，但似乎无法让它工作
【发布时间】：2013-12-14 10:32:02
【问题描述】：

http://www.weblinc.com/labs/jquery-parallax/

我已经按照了，对我不起作用，看demo的源代码，和教程完全不一样，对别人有用吗？还是坏了

<html>
    <head>
    <title></title>
    <link rel="stylesheet" type="text/css" href="global.css"/>
    <script script type="text/javascript" src="jquery.parallax.js"></script>
    </head>

    <body>
    <script>
$('.bg-far').parallax({ speed: 0.2, axis: 'x' }); 
$('.bg-close').parallax({ speed: 0.5, axis: 'x' });
</script>
    <div class="bg-far bg"></div> 
<div class="bg-close bg"></div> 
    </body>
</html>


.bg { 
position: absolute; 
top: 0; 
left: 0; 
height: 7000px; 
width: 100%; 
background-repeat: repeat; 
} 

.bg-far { 
background-image: url(bg1.png); 
opacity: 0.8; 
z-index: 5; 
} 

.bg-close { 
background-image: url(bg2.png); 
z-index: 10; 
}

这里是 jquery：

// jquery.parallax.js
// @weblinc, @jsantell, (c) 2012

;(function( $ ) {
    $.fn.parallax = function ( userSettings ) {
        var options = $.extend( {}, $.fn.parallax.defaults, userSettings );

        return this.each(function () {
            var $this   = $(this),
                isX     = options.axis === 'x',
                origPos = ( $this.css( 'background-position' ) || '' ).split(' '),
                origX   = $this.css( 'background-position-x' ) || origPos[ 0 ],
                origY   = $this.css( 'background-position-y' ) || origPos[ 1 ],
                dist    = function () {
                    return -$( window )[ isX ? 'scrollLeft' : 'scrollTop' ]();
                };
            $this
                .css( 'background-attachment', 'fixed' )
                .addClass( 'inview' );

            $this.bind('inview', function ( e, visible ) {
                $this[ visible ? 'addClass' : 'removeClass' ]( 'inview' );
            });

            $( window ).bind( 'scroll', function () {
                if ( !$this.hasClass( 'inview' )) { return; }
                var xPos = isX ? ( dist() * options.speed ) + 'px' : origX,
                    yPos = isX ? origY : ( dist() * options.speed ) + 'px';
                $this.css( 'background-position', xPos + ' ' + yPos );
            });
        });
    };

    $.fn.parallax.defaults = {
        start: 0,
        stop: $( document ).height(),
        speed: 1,
        axis: 'x'
    };

})( jQuery );

不像演示中那样移动

【问题讨论】：

你能发一个jsfiddle吗？
...或在此处发布您的代码？
如果在演示中有效，它有效，没有损坏！
我会在几秒钟内发布代码，但我的意思是你在链接中有它，我是在问教程中的代码是否错误但没关系
@user2469932 人们不应该去不同的网站来帮助你。在此处发布您的代码，我们可以告诉您哪里出错了。

标签： jquery html css

【解决方案1】：

代码是正确的，它只是高度依赖于您执行步骤的顺序。如果您有 jQuery 代码在执行时它们将不存在的元素，则不会选择任何内容，并且代码不会做任何事情。有两种方法可以解决此问题：

首先声明您的 HTML 元素，然后在它们之后放置 <script> 标记以初始化插件（这是示例中它们完成的顺序）。

<div class="bg-far bg"></div> 
<div class="bg-close bg"></div> 

<script>
    $('.bg-far').parallax({ speed: 0.2, axis: 'x' }); 
    $('.bg-close').parallax({ speed: 0.5, axis: 'x' });
</script>

使用 DOM 就绪处理程序。

$(document).ready(function() {
    $('.bg-far').parallax({ speed: 0.2, axis: 'x' }); 
    $('.bg-close').parallax({ speed: 0.5, axis: 'x' });
});

2 通常是首选方法，因为这样您就不必担心代码与其交互的元素相关的位置。

您还需要在jquery.parallax.js 文件之前添加jquery.js。

【讨论】：

嗯，在 html 之后声明脚本现在使图像静止不动，根本没有滚动
@user2469932 你现在包括jQuery本身（不仅仅是视差插件）吗？您在问题中发布的内容中没有 <script> 标记。
是的，我包括 jquery 本身 <script src="http://code.jquery.com/jquery-1.8.2.min.js"></script>