이 펜의 코드를 내 사이트에 통합하려면 어떻게해야합니까?

Question

필자의 WordPress 웹 사이트와 동일한 코드로이 펜을 만들었지 만, 실제 웹 사이트에서는 작동하지 않습니다. 나는 사이트 캐시를 지우고 그것을 껐다. wp_enqueue_script를 사용해 보았지만 실패했다. 이 사이트에서 내 사이트를 어떻게 작동시킬 수 있습니까? 이 펜의 모든 내용은 js를 제외한 사이트에서 작동합니다. 도움! :(

HTML :

<a href="#introjump"><img class="down-arrow" src="http://www.themainconcept.com/wp-content/uploads/2015/11/down-arrow-wht.png" alt="down arrow wht"/></a> 

CSS :

.down-arrow { 
    position: fixed; 
    bottom: 1%; 
    left: 50%; 
    max-width: 3.5%; 
    min-width: 3.5%; 
    width: 3.5%; 
    box-shadow: none; 
    opacity: 0.6; 
} 
.down-arrow:hover { 
    opacity: 1; 
} 

.filler { 
    height: 10000px; 
} 

자바 스크립트 :

$(window).scroll(function() { 
    $(".down-arrow").css("opacity", 1 - 
     $(window).scrollTop()/250); 
    }); 

[링크] (https://codepen.io/ericshio/pen/zBRbAY)

Answer 1

이것은 실제로 Toby의 도움으로 저에게 도움이되었습니다. 그의 대답은 효과가 없었지만 올바른 방향으로 이끌었다.

(function($) { 
    $(window).scroll(function() { 
     $(".down-arrow").css("opacity", 1 - $(window).scrollTop()/250); 
    }); 
})(jQuery); 

Answer 2

당신이 기능을 래핑 시도 그것 감싸기 그래서 :

$(document).ready(function() { 

$(window).scroll(function() { 
    $(".down-arrow").css("opacity", 1 - 
     $(window).scrollTop()/250); 
    }); 

});