캡챠이미지와의 충돌은 어떻게 처리하시나요 ?
메인에 메뉴 하나 올리는 스크립트가 게시판의 쓰기, 게시물 보기 덧글 달기 부분의 캡챠이미지와 충돌합니다.
제가 올리고자 하는 소스
<script type="text/javascript">
$(function() {
/**
* for each menu element, on mouseenter,
* we enlarge the image, and show both sdt_active span and
* sdt_wrap span. If the element has a sub menu (sdt_box),
* then we slide it - if the element is the last one in the menu
* we slide it to the left, otherwise to the right
*/
$('#sdt_menu > li').bind('mouseenter',function(){
var $elem = $(this);
$elem.find('img')
.stop(true)
.animate({
'width':'170px',
'height':'170px',
'left':'0px'
},400,'easeOutBack')
.andSelf()
.find('.sdt_wrap')
.stop(true)
.animate({'top':'100px'},500,'easeOutBack')
.andSelf()
.find('.sdt_active')
.stop(true)
.animate({'height':'60px'},300,function(){
var $sub_menu = $elem.find('.sdt_box');
if($sub_menu.length){
var left = '170px';
if($elem.parent().children().length == $elem.index()+1)
left = '-170px';
$sub_menu.show().animate({'left':left},200);
}
});
}).bind('mouseleave',function(){
var $elem = $(this);
var $sub_menu = $elem.find('.sdt_box');
if($sub_menu.length)
$sub_menu.hide().css('left','0px');
$elem.find('.sdt_active')
.stop(true)
.animate({'height':'0px'},300)
.andSelf().find('img')
.stop(true)
.animate({
'width':'0px',
'height':'0px',
'left':'85px'},400)
.andSelf()
.find('.sdt_wrap')
.stop(true)
.animate({'top':'25px'},500);
});
});
/script>
// 요 부분에서 딱 막히지 말입니다.
$('#sdt_menu > li').bind('mouseenter',function(){
//캡챠 부분만 삭제하면 이쁘게 경고 리본을 달지 않습니다.
혹시 충돌없는 캡챠이미지 생성 소스 없을까요 ?
제가 올리고자 하는 소스
<script type="text/javascript">
$(function() {
/**
* for each menu element, on mouseenter,
* we enlarge the image, and show both sdt_active span and
* sdt_wrap span. If the element has a sub menu (sdt_box),
* then we slide it - if the element is the last one in the menu
* we slide it to the left, otherwise to the right
*/
$('#sdt_menu > li').bind('mouseenter',function(){
var $elem = $(this);
$elem.find('img')
.stop(true)
.animate({
'width':'170px',
'height':'170px',
'left':'0px'
},400,'easeOutBack')
.andSelf()
.find('.sdt_wrap')
.stop(true)
.animate({'top':'100px'},500,'easeOutBack')
.andSelf()
.find('.sdt_active')
.stop(true)
.animate({'height':'60px'},300,function(){
var $sub_menu = $elem.find('.sdt_box');
if($sub_menu.length){
var left = '170px';
if($elem.parent().children().length == $elem.index()+1)
left = '-170px';
$sub_menu.show().animate({'left':left},200);
}
});
}).bind('mouseleave',function(){
var $elem = $(this);
var $sub_menu = $elem.find('.sdt_box');
if($sub_menu.length)
$sub_menu.hide().css('left','0px');
$elem.find('.sdt_active')
.stop(true)
.animate({'height':'0px'},300)
.andSelf().find('img')
.stop(true)
.animate({
'width':'0px',
'height':'0px',
'left':'85px'},400)
.andSelf()
.find('.sdt_wrap')
.stop(true)
.animate({'top':'25px'},500);
});
});
/script>
// 요 부분에서 딱 막히지 말입니다.
$('#sdt_menu > li').bind('mouseenter',function(){
//캡챠 부분만 삭제하면 이쁘게 경고 리본을 달지 않습니다.
혹시 충돌없는 캡챠이미지 생성 소스 없을까요 ?
|
댓글을 작성하시려면 로그인이 필요합니다.
로그인
댓글 3개
다시 읽기하면 텅빈이미지라 꼭 클릭을 해야만 나타나는 현상이 있습니다.
좋긴한데 ... 머라 말하기도 그렇고 아무튼 니가 먼저니 내가 먼저니... 서로 티격태격 싸우지 않으니 기분은 좋습니다.
결국............................................
프로토타입 빼고 아작스로 해결 보았습니다.
제이쿼리와 프로토타입의 충돌이 있다고 합니다.