3
외부 자바 스크립트 파일이 페이지에서 마지막으로로드되는지 확인하려고합니다.html 페이지로드 후 javascript로드
자바 스크립트 파일 "script.js"(이미지 슬라이더를 제어 함)는 마지막에 있어야합니다. 내 웹 페이지가 파일에 정의 된 빨간색 배경 이미지로 덮여 있기 때문에 마지막으로로드하지 않는 것으로 판단됩니다. script.js 파일을 제거하면 웹 페이지가 정상적으로 표시되지만 슬라이더 기능이 작동하지 않습니다.
처음로드 할 때 빨간색 배경 이미지로 덮히기 전에 적절한 레이아웃이 1 초 동안 표시됩니다.
<!-- script references -->
<!-- jquery script -->
<script type='text/javascript' src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
\t <script type='text/javascript' src="js/bootstrap.min.js"></script>
<script type='text/javascript' src="js/classie.js"></script>
<script type='text/javascript' src="js/main.js"></script>
<!-- script -->
\t <script type='text/javascript' src="js/script.js"></script>현재 내 html 파일의 끝에서, 나는이 작동하지 않습니다.
var script = document.createElement('script');
script.setAttribute('src', 'http://learningbycreating.com/js/script.js');
script.setAttribute('type', 'text/javascript');
document.getElementsByTagName('head')[0].appendChild(script);그때 require.js을 시도
을 시도했지만, 꽤 자바 스크립트의 내 시작 레벨을 부여 잃었다. 나는 인해 jQuery를 사용에하지만 오류를받은
<script>
$.getScript("Your js file path",function(){
$(document).ready(ready);
});
</script>이 문제를 일으키는 자바 스크립트 파일은 다음과 같습니다
(function() {
var pages = [].slice.call(document.querySelectorAll('.pages > .page')),
currentPage = 0,
revealerOpts = {
// the layers are the elements that move from the sides
nmbLayers: 3,
// bg color of each layer
bgcolor: ['#0092DD', '#fff', 'red'],
// effect classname
effect: 'anim--effect-1',
onStart: function(direction) {
// next page gets class page--animate-[direction]
var nextPage = pages[currentPage === 0 ? 0 : currentPage];
classie.add(nextPage, 'page--animate-' + direction);
},
onEnd: function(direction) {
// remove class page--animate-[direction] from next page
var nextPage = pages[currentPage === 0 ? pages.length - 1 : 0];
nextPage.className = 'page';
}
};
revealer = new Revealer(revealerOpts);
// clicking the page nav buttons
document.querySelector('button.pagenav__button--top').addEventListener('click', function() {
reveal('top');
});
document.querySelector('button.pagenav__button--bottom').addEventListener('click', function() {
reveal('bottom');
});
// triggers the effect by calling instance.reveal(direction, callbackTime, callbackFn)
function reveal(direction) {
var callbackTime = 750,
callbackFn = function() {
classie.remove(pages[currentPage], 'page--current');
currentPage = currentPage < pages.length - 1 ? currentPage + 1 : 0;
classie.add(pages[currentPage], 'page--current');
};
revealer.reveal(direction, callbackTime, callbackFn);
}
})();내가 부족 간단한 수정이있을 가능성은?
감사합니다.
본문 요소의 닫기 태그 바로 앞에 스크립트가 있습니까? – ImprobabilityCast
스크립트 로딩 순서가 문제인지 확인하십시오. 문제가 사라 졌는지보기 위해 창을로드 한 후 10 초 시간 초과를 사용하여 스크립트를로드한다고 가정 해보십시오. [최소한의 완전하고 검증 가능한 예] (https://stackoverflow.com/help/mcve)도 도움이 될 것입니다. – traktor53