jQuery가 탐색 메뉴의 mouseover 이벤트와 충돌합니다.

Question

Mouseover에서 하위 범주를 표시하는 탐색 메뉴가 Magento에 있습니다. jQuery 플러그인을 사용하는 카운트 다운도 있습니다.

카운트 다운을 제거하면 메뉴가 제대로 작동하지만 카운트 다운을 추가하면 카운트 다운이 제대로 작동하지만 메뉴가 마우스 오버시 더 이상 범주를 표시하지 않습니다.

메뉴 항목의 코드 :

<div id="menu10" class="menu popup-menu level-2" onmouseover="wpShowMenuPopup(this, 'popup10');" onmouseout="wpHideMenuPopup(this, event, 'popup10', 'menu10')"> 
<div class="parentMenu"> 
<a href="supertrash.html"> 
<span>SuperTrash</span> 
</a> 
</div> 
</div> 
<div id="popup10" class="popup child-2" onmouseout="wpHideMenuPopup(this, event, 'popup10', 'menu10')"> 
<div class="block1"> 
<div class="column"><div class="itemMenu level1"><a class="itemMenuName level1" href="supertrash/supertrash-rokjes.html">Rokjes</a></div></div><div class="column"><div class="itemMenu level1"><a class="itemMenuName level1" href="supertrash/stschoenen.html">Schoenen</a></div></div> 
<div class="clearBoth"></div> 
</div> 
</div>  

마우스 오버를위한 자바 스크립트 : 나는 '

<!-- jquery framework from google api --> 
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.1/jquery.min.js"></script> 

<!-- google font-family, you can add whatever font suits you --> 
<link href='http://fonts.googleapis.com/css?family=Averia+Serif+Libre:300italic' rel='stylesheet' type='text/css'> 

<!-- The stylesheet --> 
<link rel="stylesheet" type="text/css" href="counter2/css/style2.css"> 

<!-- the countdown plugin --> 
<script src="counter2/coffeetime/coffeetime.min.js"></script> 
<!-- The countdown style --> 
<link rel="stylesheet" type="text/css" href="counter2/coffeetime/ctstyle.css"> 
<script> 

/* here u can set up different messages for the progress of the countdown 
if no message is set for the current percent value, it takes the next message, bigger or equal to that percentage 
*/ 
var message = new Array(); 
message[0] = "status: just started"; 
message[10] = "status: drinking a coffe"; 
message[20] = "status: just finished setting up the database"; 
message[30] = "status: brainstorming about the template"; 
message[50] = "status: choosing the color scheme"; 
message[80] = "status: thinking about the future"; 
message[90] = "status: nearly done"; 
message[100] = "status: finished"; 

$(document).ready(function() { 

function callback() { 
    alert("Sale is over"); 
} 


$("#flipit").coffeetime({ 
         /* COUNTDOWN SETTINGS */ 
         message: message, // the message array with the array keys as percent values 
         startYear: 2012, 
         startMonth: 8, 
         startDay: 30, 
         endYear: 2012, 
         endMonth: 9, 
         endDay: 7, 

         callbackFinish : callback, 
          }); 

$(".flip-title-subheading").html(" we started on "+ window.startDate+ " and we`ll finish on "+ window.endDate); 

}); 

$(document).ready(function() { 
    setTimeout(function() { 
     $(".flip-container").animate({ 
      "height" : 105 + "px" 
     }, 1000, "swing"); 
    }, 1000); 
}); 

</script> 

: 카운트 다운에 사용되는

function wpShowMenuPopup(objMenu, popupId) 
{ 
    objMenu = $(objMenu.id); var popup = $(popupId); if (!popup) return; 
    popup.style.display = 'block'; 
    objMenu.addClassName('active'); 
    var popupWidth = CUSTOMMENU_POPUP_WIDTH; 
    if (!popupWidth) popupWidth = popup.getWidth(); 
    var pos = wpPopupPos(objMenu, popupWidth); 
    popup.style.top = pos.top + 'px'; 
    popup.style.left = pos.left + 'px'; 
    if (CUSTOMMENU_POPUP_WIDTH) popup.style.width = CUSTOMMENU_POPUP_WIDTH + 'px'; 
} 

JQuery와 플러그인 여러 가지 시도 :

헤더에서 691,363,210

• 또한 jQuery를 포함하는 (나이 (1.4.3)) 버전있다, 나는 1.8을 제거하려고했습니다

• 1.8.0 버전으로, 그러나 아무 일 없다는 교체 시도 카운트 다운에 포함 된 0.0 버전은 메뉴가 제대로 작동되지만 카운트 다운

• 나는 카운트 다운에 대한 jQuery.noConflict()를 사용 해본 적이 메뉴가 작동 유지하지만 카운트 다운이

을하지 않습니다

나는 잃었습니다. 오므론은 내가 뭘 잘못하고 있는지 안다. 고마워!

Answer 1

noConflict()를 사용해 보겠다고 말 하겠지만 이미 시도해 보았습니다. 그래서, jQuery에 대해 $를 변경해보십시오.이 보증 마젠트는 올바른 JS를 사용하고, cuz 프로토 타입은 $도 사용합니다. 작동하지 않는 경우 페이지에서 동일한 작업을 수행하는 2 개의 JS 스크립트를 찾으십시오. 제거해 줘.

Answer 2

는

jQuery.noConflict(); 

function wpShowMenuPopup(objMenu, popupId) 

{

objMenu = jQuery(objMenu.id); var popup = jQuery(popupId); if (!popup) return; 
popup.style.display = 'block'; 
objMenu.addClassName('active'); 
var popupWidth = CUSTOMMENU_POPUP_WIDTH; 
if (!popupWidth) popupWidth = popup.getWidth(); 
var pos = wpPopupPos(objMenu, popupWidth); 
popup.style.top = pos.top + 'px'; 
popup.style.left = pos.left + 'px'; 
if (CUSTOMMENU_POPUP_WIDTH) popup.style.width = CUSTOMMENU_POPUP_WIDTH + 'px'; 

}이 도움이

희망으로 마우스 오버 기능을 추가!

Answer 3

어쨌든 noConflict()였습니다. 바로 카운트 다운 스크립트

var $c = jQuery.noConflict(); 

하기 전에 다음을 추가하고 $c에 카운트 다운의 모든 $ 변수를 변경

일했다.

noConflict (앞에서 선언 했음)에 대해 $i 및 $j 변수를 사용하고 있지만 새로운 하나의 마법을 만들었습니다. 모두에게 감사드립니다!