jQuery로 시차 객체의 프로토 타입을 만들기 내가

Question

바이올린 http://jsfiddle.net/chdhmphry/z8upoccm/

내가 한 페이지에 여러 스크롤 상호 작용에 대해 "시차"프로토 타입을 만들려고하고 jQuery를 함수에 정의되지 않은 오류가 계속하지만, 내가 점점 계속 "catch되지 않은 형식 오류 : undefined는 12, 13, 35 행의 함수가 아닙니다. "저는 Prototypes에 익숙하지 않지만 jQuery는 프로토 타입과 잘 작동하지 않습니까? 오류없이 다른 영역의 다른 jquery 코드를 사용하고 있습니다. 요소와 상호 작용할 때만 사용됩니다.

Object.prototype.parallax = function(userOptions){ 

    // Default info 
    var options = { 
    speed: 6, 
    direction: "down" 
    }; 
    options = $.extend(options, userOptions); 

    // Element info 
    var element = this; 
    var startPoint = element.position().top; 
    var endPoint = element.position().top + element.height(); 

    // Scroll info 
    var scrollPos = { 
    top: $(window).scrollTop(), 
    bottom: $(window).scrollTop() + $(window).height() 
    }; 

    // first call 
    scrolling(); 

    // call on scroll 
    $(window).on("scroll", function(){ 
    scrolling(); 
    }); 

    function scrolling(){ 
    scrollPos = { 
     top: $(window).scrollTop(), 
     bottom: $(window).scrollTop() + $(window).height() 
    }; 

    element.css({"transform": "translateY("+(scrollPos.top - startPoint)+")"}); 

    } 
}; 

$("#js-new-title-stuck-3").parallax({speed:2}); 

고마워요!

는

Answer 1

내가 여기서 할 것이다 일 (바이올린 http://jsfiddle.net/z8upoccm/2/ 작업)의 몇 :

1)이 기능은 일반 DOM 요소에 다시 예상대로 JQuery와 객체 초기화,하지만 것 같다. jquery 요소 만 통과하도록 허용하십시오.

Object.prototype.parallax = function(userOptions){ 
    if(!this.jquery) return false; 

2) 당신은 당신의 CSS 속성을 변환에 대한 단위를 필요로하는 트릭을 할 것 같았다

element.css({"transform": "translateY("+(scrollPos.top - startPoint)+"px)"});