제이쿼리 충돌?

매출이 오르면 내리는 수수료! 지금 수수료센터에서 전자결제(PG)수수료 비교견적 신청해 보세요!
제이쿼리 충돌?

QA

제이쿼리 충돌?

본문

단독으로 썼을때는 구동이 되는데
메인페이지에 출력하려고 하니 구동이 안되는데여..
혹시 메인에 다른 슬라이드와  prev next 이름이 똑같아서 그런가여 ?
ㅠ;ㅠ 이름을 바꾸면 되나요 ? 된다면 어디어디를 바꿔야되는지 좀 알려주세요,ㅠㅠ 
도와주세여 ..;

<div id="notice5" class="news" style="margin-top:30px; padding-top:0;">
	<div class="open-event fl" style="width:400px;">
		<ul class="notice-list">
			<li><a href="#">1. '보코' 손승연, 美 버클리 음대 합격 "버클리도 반했다"</a><span class="date">2011.08.11</span></li>
			<li><a href="#">2. K팝스타 러브라인, 이승훈 두고 백아연·이미쉘 신경전?</a><span class="date">2011.08.11</span></li>
			<li><a href="#">3. '내 아내의 모든 것', '어벤져스' 제쳤다..예매율 1위...</a><span class="date">2011.08.11</span></li>
			<li><a href="#">4. '사랑비' 이미숙-정진영, 아름다운 이별…</a><span class="date">2011.08.11</span></li>
			<li><a href="#">5. 최효종, 다시 한 번 강용석 의원이 고소한다면?</a><span class="date">2011.08.11</span></li>
		</ul>
		<span id="bt5">
			<a href="#" class="prev"><img src="http://mylko72.maru.net/jquerylab/images/ico/bul_arrow_up.gif" alt="Prev"></a>
			<a href="#" class="next"><img src="http://mylko72.maru.net/jquerylab/images/ico/bul_arrow_down.gif" alt="Next"></a>
		</span>
	</div>
	<div class="control fl">
		<a href="#" class="play" title="재생">▷</a>
		<a href="#" class="stop" title="정지">▣</a>
	</div>
	<script type="text/javascript">fn_article3('notice5','bt5',true);</script>
</div>
<style type="text/css">
	.news {padding:0 0px 20px;}
		.news .open-event {height:16px; position:relative; border:1px solid #ccc; overflow:hidden;}
		.news .open-event ul{position:absolute; top:0px;}
		.news .open-event ul#notice1 {left:0;}
		.news .open-event ul#notice2 {right:20px;}
		.news .open-event ul li {height:20px;}
		.news .open-event ul li a {display:inline-block; width:310px;}
		.news .open-event ul li a:hover {color:#8f7614; text-decoration:underline;}
		.news .open-event ul li a strong {margin-right:10px;}
		.news .open-event ul li span.date {display:inline-block; width:60px;}
			.news .open-event .prev{position:absolute; top:1px; right:2px; width:7px; height:4px; line-height:0; font-size:0;}
			.news .open-event .next{position:absolute; bottom:1px; right:2px; width:7px; height:4px; line-height:0; font-size:0;}
		.news .control {float:left; margin:0px 0 0 10px; }
			.news .control a.stop {font-size:12px;}
			.news .control a.on {color:red; font-size:12px;}
</style>

<script>
function fn_article3(containerID, buttonID, autoStart){
	var $element = $('#'+containerID).find('.notice-list');
	var $prev = $('#'+buttonID).find('.prev');
	var $next = $('#'+buttonID).find('.next');
	var $play = $('#'+containerID).find('.control > a.play');
	var $stop = $('#'+containerID).find('.control > a.stop');
	var autoPlay = autoStart;
	var auto = null;
	var speed = 2000;
	var timer = null;

	var move = $element.children().outerHeight();
	var first = false;
	var lastChild;

	lastChild = $element.children().eq(-1).clone(true);
	lastChild.prependTo($element);
	$element.children().eq(-1).remove();

	if($element.children().length==1){
		$element.css('top','0px');
	}else{
		$element.css('top','-'+move+'px');
	}

	if(autoPlay){
		timer = setInterval(moveNextSlide, speed);
		$play.addClass('on').text('▶');
		auto = true;
	}else{
		$play.hide();
		$stop.hide();
	}

	$element.find('>li').bind({
		'mouseenter': function(){
			if(auto){
				clearInterval(timer);
			}
		},
		'mouseleave': function(){
			if(auto){
				timer = setInterval(moveNextSlide, speed);
			}
		}
	});

	$play.bind({
		'click': function(e){
			if(auto) return false;

			e.preventDefault();
			timer = setInterval(moveNextSlide, speed);
			$(this).addClass('on').text('▶');
			$stop.removeClass('on').text('▣');
			auto = true;
		}
	});

	$stop.bind({
		'click': function(e){
			if(!auto) return false;

			e.preventDefault();
			clearInterval(timer);
			$(this).addClass('on').text('■');
			$play.removeClass('on').text('▷');
			auto = false;
		}
	});

	$prev.bind({
		'click': function(){
			movePrevSlide();
			return false;	
		},
		'mouseenter': function(){
			if(auto){
				clearInterval(timer);
			}
		},
		'mouseleave': function(){
			if(auto){
				timer = setInterval(moveNextSlide, speed);
			}
		}
	});

	$next.bind({
		'click': function(){
			moveNextSlide();
			return false;
		},
		'mouseenter': function(){
			if(auto){
				clearInterval(timer);
			}
		},
		'mouseleave': function(){
			if(auto){
				timer = setInterval(moveNextSlide, speed);
			}
		}
	});

	function movePrevSlide(){
		$element.each(function(idx){
			if(!first){
				$element.eq(idx).animate({'top': '0px'},'normal',function(){
					lastChild = $(this).children().eq(-1).clone(true);
					lastChild.prependTo($element.eq(idx));
					$(this).children().eq(-1).remove();
					$(this).css('top','-'+move+'px');
				});
				first = true;
				return false;
			}

			$element.eq(idx).animate({'top': '0px'},'normal',function(){
				lastChild = $(this).children().filter(':last-child').clone(true);
				lastChild.prependTo($element.eq(idx));
				$(this).children().filter(':last-child').remove();
				$(this).css('top','-'+move+'px');
			});
		});
	}

	function moveNextSlide(){
		$element.each(function(idx){

			var firstChild = $element.children().filter(':first-child').clone(true);
			firstChild.appendTo($element.eq(idx));
			$element.children().filter(':first-child').remove();
			$element.css('top','0px');

			$element.eq(idx).animate({'top':'-'+move+'px'},'normal');

		});
	}
}
</script>

이 질문에 댓글 쓰기 :

답변 2

보통 jquery 충돌은 js include 순서에 상관있습니다.

(plugin 설정)


<script src="a"/>

<script src="b"/> 


를 


<script src="b"/>

<script src="a"/>


와 같이 바꿔보시고..


정확한건 오류 로그를 봐야 알꺼 같긴합니다..


확인해보니


<script type="text/javascript">fn_article3('notice5','bt5',true);</script>

이 부분이 문제입니다.


위 영역을



<script type="text/javascript">
$(function(){
	$(".control a").click(function(){
		fn_article3('notice5','bt5',true);
	});
});
</script>

로 변경해보세요
답변을 작성하시기 전에 로그인 해주세요.
전체 0
QA 내용 검색

회원로그인

(주)에스아이알소프트 / 대표:홍석명 / (06211) 서울특별시 강남구 역삼동 707-34 한신인터밸리24 서관 1404호 / E-Mail: admin@sir.kr
사업자등록번호: 217-81-36347 / 통신판매업신고번호:2014-서울강남-02098호 / 개인정보보호책임자:김민섭(minsup@sir.kr)
© SIRSOFT