자바스크립트 충돌
본문
2개의 자바스크립트를 사용중인데요.
각기 적용했을때는 문제가 없는데 같이 사용하면 충돌이 나면서 어느 하나가 기능 작동이 되지 않습니다.
검색을 해보니..
noConflict() 메소드를 적용하라고 하는데요. 잘 안되네요.
https://palpit.tistory.com/256
각각의 원래 스크립트는 아래와 같았습니다.
<!-- 슬라이더 스크립트 -->
<script type="text/javascript">
jQuery.noConflict();
(function($){
$(document).ready(function(){
$('.bxslider').bxSlider({
auto: true,
controls: false,
pager: true
});
});
})(jQuery);
</script>
<!-- 메뉴 스크립트 -->
<script language="JavaScript">
$(document).ready(function(){
$('#amenu-list').amenu({
'speed': 200, //Fast(200), Medium(400), Slow(600)
'animation': 'slide' //show,fade,slide,wind,none
});
});
</script>
어떻게 처리하는 것이 좋을까요?
답변 2
한 곳에 몰아넣어도 되고, addEventListener를 사용해도 되겠네요.
- https://developer.mozilla.org/en-US/docs/Web/API/EventTarget/addEventListener
슬라이더가 메인 페이지에만 있고, 서브 페이지에는 없다면 조건 추가해주면 되겠고요.
<script type="text/javascript">
jQuery.noConflict();
(function($){
$(document).ready(function(){
$('.bxslider').bxSlider({
auto: true,
controls: false,
pager: true
});
$('#amenu-list').amenu({
'speed': 200, //Fast(200), Medium(400), Slow(600)
'animation': 'slide' //show,fade,slide,wind,none
});
});
})(jQuery);
</script>
타이머는 기본적으로 같이 공유하기때문에 그런듯합니다.
따로하면 되지만 같이 이용하면 두 시간을 같이 사용하니 문제가 생깁니다.