js끼리 충돌 왜이러는거죠?
본문
js스크립트가 충돌해서 하나가 작동하면 다른 스크립트가 작동안하네요
제가 네비(boxcategory.skin)에 자바스크립트 하나 심었구요/
네비자바스크립트 경로는 skin/shop/basic/boxcategory.skin.php 입니다
그리고 충돌되는 자바스크립트는 item.form.skin.php/ shop.js 과 충돌되는거같은데요
왜 이러는거죠
각각의 js코드도 올려보겠습니다 ㅠㅠ
먼저 - > boxcategory.skin.php 안에있는 example.js 입니다
$(function(){
var $el, leftPos, newWidth,
$mainNav = $("#gnb_1dul"),
$mainNav2 = $("#example-two");
/*
EXAMPLE ONE
*/
$mainNav.append("<li id='magic-line'></li>");
var $magicLine = $("#magic-line");
$magicLine
.width($("#gnb_1dul >li:first ").width())
.css("left", $("#gnb_1dul >li:first a").position().left)
.data("origLeft", $magicLine.position().left)
.data("origWidth", $magicLine.width());
$("#gnb_1dul li").find("a").hover(function() {
$el = $(this);
leftPos = $el.position().left;
newWidth = $el.parent().width();
$magicLine.stop().animate({
left: leftPos,
width: newWidth
});
}, function() {
$magicLine.stop().animate({
left: $magicLine.data("origLeft"),
width: $magicLine.data("origWidth")
});
});
/*
EXAMPLE TWO
*/
$mainNav2.append("<li id='magic-line-two'></li>");
var $magicLineTwo = $("#magic-line-two");
$magicLineTwo
.width($(".current_page_item_two").width())
.height($mainNav2.height())
.css("left", $(".current_page_item_two a").position().left)
.data("origLeft", $(".current_page_item_two a").position().left)
.data("origWidth", $magicLineTwo.width())
.data("origColor", $(".current_page_item_two a").attr("rel"));
$("#example-two li").find("a").hover(function() {
$el = $(this);
leftPos = $el.position().left;
newWidth = $el.parent().width();
$magicLineTwo.stop().animate({
left: leftPos,
width: newWidth,
backgroundColor: $el.attr("rel")
})
}, function() {
$magicLineTwo.stop().animate({
left: $magicLineTwo.data("origLeft"),
width: $magicLineTwo.data("origWidth"),
backgroundColor: $magicLineTwo.data("origColor")
});
});
});
그리고 충돌되는 item.form.skin.php안에 있는 자바스크립트와 / shop.js 자바스크립트인데요
먼저 item.form.skin.php 부터 올리겠습니다.
<script>
$(function(){
// 상품이미지 첫번째 링크
$("#sit_pvi_big a:first").addClass("visible");
// 상품이미지 미리보기 (썸네일에 마우스 오버시)
$("#sit_pvi .img_thumb").bind("mouseover focus", function(){
var idx = $("#sit_pvi .img_thumb").index($(this));
$("#sit_pvi_big a.visible").removeClass("visible");
$("#sit_pvi_big a:eq("+idx+")").addClass("visible");
});
// 상품이미지 크게보기
$(".popup_item_image").click(function() {
var url = $(this).attr("href");
var top = 10;
var left = 10;
var opt = 'scrollbars=yes,top='+top+',left='+left;
popup_window(url, "largeimage", opt);
return false;
});
});
// 바로구매, 장바구니 폼 전송
function fitem_submit(f)
{
if (document.pressed == "장바구니") {
f.sw_direct.value = 0;
} else { // 바로구매
f.sw_direct.value = 1;
}
// 판매가격이 0 보다 작다면
if (document.getElementById("it_price").value < 0) {
alert("전화로 문의해 주시면 감사하겠습니다.");
return false;
}
if($(".sit_opt_list").size() < 1) {
alert("상품의 선택옵션을 선택해 주십시오.");
return false;
}
var val, io_type, result = true;
var sum_qty = 0;
var min_qty = parseInt(<?php echo $it['it_buy_min_qty']; ?>);
var max_qty = parseInt(<?php echo $it['it_buy_max_qty']; ?>);
var $el_type = $("input[name^=io_type]");
$("input[name^=ct_qty]").each(function(index) {
val = $(this).val();
if(val.length < 1) {
alert("수량을 입력해 주십시오.");
result = false;
return false;
}
if(val.replace(/[0-9]/g, "").length > 0) {
alert("수량은 숫자로 입력해 주십시오.");
result = false;
return false;
}
if(parseInt(val.replace(/[^0-9]/g, "")) < 1) {
alert("수량은 1이상 입력해 주십시오.");
result = false;
return false;
}
io_type = $el_type.eq(index).val();
if(io_type == "0")
sum_qty += parseInt(val);
});
if(!result) {
return false;
}
if(min_qty > 0 && sum_qty < min_qty) {
alert("선택옵션 개수 총합 "+number_format(String(min_qty))+"개 이상 주문해 주십시오.");
return false;
}
if(max_qty > 0 && sum_qty > max_qty) {
alert("선택옵션 개수 총합 "+number_format(String(max_qty))+"개 이하로 주문해 주십시오.");
return false;
}
return true;
}
</script>
방법좀 찾아주시면 너무 감사드리곘습니다
일단 기본적으로 왜 js끼리 충돌되는지가 궁금합니다....
