无法访问的变量，并使用对象文本模块模式

Question

我无法访问我的DOM选择，即使我“这个”窗口事件之前缓存的应用某些CSS。

如果我改变它只是$('.banner')它的工作原理。
在我的代码之前，我在窗口事件上设置了scrolltop设置变量scrolled，我可以在我的scrollEvent()方法中使用module.scrolled。

此外，在CSS透明度规则是行不通的。
虽然顶部和相对位置。

var parallax = { 
    init: function() { 
    this.cacheDom(); 
    this.scrollEvent(); 
    }, 

    cacheDom: function() { 
    var $window = $(window), 
     banner = $('.banner'), 
     callout = $('.callout'), 
     bannerHeight = Math.round(banner.outerHeight()), 
     hideElem = false, 
     hasScrolled = false, 
     scrolled; 
    }, 

    scrollEvent: function() { 
    var module = this; 
    $(window).on('scroll', function() { 
     var scrollTop = $(this).scrollTop(); 
     module.banner.css("background-position", '50%' + (scrollTop/1.75) + "px"); 
     module.callout.css({'position': 'relative', 'top' : scrollTop * 0.75, 'opacity' : 1 - (scrollTop/module.bannerHeight * 2)}); 
    }); 
    } 
}; 

parallax.init(); 

Answer 1

cacheDom()函数是设置局部变量，而不是对象属性。更改为：

cacheDom: function() { 
    this.$window = $(window); 
    this.banner = $('.banner'); 
    this.callout = $('.callout'), 
    this.bannerHeight = Math.round(this.banner.outerHeight()); 
    this.hideElem = false; 
    this.hasScrolled = false; 
    this.scrolled = null; 
    },