Question

下面的功能大部分都有效 - 它可以根据需要移动背景，但我希望该功能可以在任何具有＆＃34; animate＆＃34;类的元素上运行，而不是必须调用每个元素。底部。我尝试了$（＆＃39; .animate＆＃39;）。load（function（）{};但它不会工作...谢谢

JAVASCRIPT

$(window).load(function(){
(function(){
      $.fn.move = function(){
            var $this = $(this);
            var offset = $this.offset().top;
            var start = 0;
            var end = offset + $this.height();
            var speed = $this.attr("speed");
            return this.each(function(){
                  $(window).bind('scroll', function() {
                       var windowPos = $(window).scrollTop();
                        if((windowPos >= start) && (windowPos <= end)) {
                              var newCoord = windowPos * speed;
                              $this.css({'background-position': '0 '+ newCoord + 'px'});
                        };
                  });
            });
      };
})(jQuery);

$('.animate').move();
});

HTML

<div class="welcome_6"></div>
    <div class="welcome_5"></div>
    <div class="welcome_4"></div>
    <div class="welcome_3"></div>
    <div class="welcome_2 animate" speed="-1"></div>
    <div class="welcome_1 animate" speed="0"></div>

修改：当我滚动页面时，元素根据滚动位置移动。每个元素以不同的速度移动（设置为html属性）。这段代码以相同的速度移动它们。我假设$（＆＃39; .animate＆＃39;）应该在顶部的某个位置替换$ .fn.move，但我无法弄明白。

Answer 1

应该是$('.animate')而不是$('animate')请注意查询开头的点，该点告诉jQuery您正在寻找一个类。

Answer 2

我认为问题在于您在load函数中使用立即调用的函数的方式，并且您在底部传递jQuery而不是直接调用函数。只要脚本标记放在jquery脚本标记

之后，这将更新背景位置

这是js小提琴的链接：

更新：

我没有确切的样式代码，所以我即兴创作，但如果你检查元素背景位置正在更新;

AND UPDATE：

＆＃13;

$.fn.move = function() {
  var $this = $(this);
  var offset = $this.offset().top;
  var start = 0;
  var end = offset + $this.height();
  return this.each(function(index, element) {
    var $element = $(element);
    var speed = $element.attr("speed");
    $(window).bind('scroll', function() {
      var windowPos = $(window).scrollTop();
      if ((windowPos >= start) && (windowPos <= end)) {
        var newCoord = windowPos * speed;
        $element.css({
          'background-position': '0 ' + newCoord + 'px'
        });
      };
    });
  });
};

$(document).ready(function() {
  $('.animate').move();
});

＆＃13;

编辑：你的＆＃39;这个＆＃39;绑定已关闭，你的速度在this.each

之外声明

为包含类的每个元素执行jquery函数

2 个答案: