jQuery中的垂直视差

Cha*_*yan 7 css jquery frontend jquery-plugins parallax

我正在建立我的投资组合网站,我有一点困难,基本上我有两个小问题......

  1. 当位置在x轴上包含"center"属性时,我无法获得背景位置以在y轴上设置动画

  2. 我无法在滚动时发生效果,在停止滚动时暂停,在继续滚动时继续

这是我正在使用的代码:

//Top section parallax
$(function parallaxInnerAnimation(){

    //Reset the background position
    $('#first-canvas .inner').css({backgroundPosition: 'center 0px'});

    //Set the animations
    $(window).scroll(function() {
        $('#first-canvas .inner').animate({
        backgroundPosition:"(center -200px)"
        }, 5000, 'linear');
    });

});
Run Code Online (Sandbox Code Playgroud)

我正在使用Alexander Farkas的jquery.backgroundPosition插件v1.22和jQuery 1.6.1.

这个网站是css3和html5,主要用于支持IE9,Firefox 4和Chrome 11等...我正在为旧浏览器创建一个不同的网站,因此可以牺牲向后兼容性

对不起,如果它是一个愚蠢的问题,我不是一个真正的开发人员,更多的是能够编写前端内容的设计师,提前感谢.

更新:

把它放在上下文中,我现在把它放在我的实时服务器上http://charlieryan.co.uk/stack-overflow/

Sha*_*oli 1

我查看了backgroundPosition.charlieryan.js插件,它不支持中心背景位置。您可能需要修改该插件并使用它。有一个名为 toArray 的方法,我应该修改它。js错误与这个问题有关。如果您需要更多帮助,请告诉我。