2010-04-07 5 views
0
$(".container").hover(
    function(){ 
       $(".child-1").hide(0); 
       $(".child-2").show(0); 
    },function(){ 
       $(".child-1").show(0); 
       $(".child-2").hide(0); 
}); 

프로젝트 mootools를 사용해야하지만 mootools는 사용하지 않았으며 jquery는 나에게 훨씬 더 합리적입니다. 누군가 mootools에서이 예제가 어떻게 보이는지 보여 줄 수 있습니까? , $는 ID로 요소를 검색하는 데 사용되며, $$ 다른 모든 것들입니다 $하고, Mootools의에서 $$mootools에 간단한 jQuery를 트랜스 코딩하는 데 도움이됩니다.

<div id="someId">..</div> 
<p class="someClass">..</p> 

Jquery   | MooTools 
------------------------------- 
$("#someId")  | $("someId") 
$(".someClass") | $$(".someClass"); 

: 감사

답변

6

Mootools의 두 가지 속기 방법을 사용합니다. Mootools의-더에서 Element.Shortcuts의 일부 바로 가기 방법은

$$(".container").addEvents({ 
    mouseenter: function() { 
     $$(".child-1").hide(); 
     $$(".child-2").show(); 
    }, 
    mouseleave: function() { 
     $$(".child-1").show(); 
     $$(".child-2").hide(); 
    } 
}); 

.hide()와 .show(),하지만 당신이 원하는 경우에 당신이 자신을 정의 할 수 있습니다 : 그래서 위와 같이 구현 될 수있다.

그러나 jQuery 구문에 익숙하고 생산성을 향상 시키려면 Lim Chee Aun이 프로젝트 Mooj을 확인하십시오. MooTools에서 거의 jQueryish 구문을 사용할 수 있습니다.

MooTools 만 사용할 특별한 이유가 없다면, MooTools with jQuery을 David Walsh의 블로그에 사용하는 방법을 확인하십시오.

DOM을 위해 jQuery를 사용하고 객체 지향성을 위해 MooTools를 사용하려면 Florence Ryan이 작성한 this article을 확인하십시오.

마지막으로 두 프레임 워크를 비교해 보면 체크 아웃 값이 definitive article 인 Aaron Newton입니다.

+1

네이티브 mouseover/mouseout을 사용하지 말고 mouseenter/mouseleave를 대신 사용하십시오 (자식 요소 및 이벤트 버블 링에 마우스 오버 수정) –

+0

아 좋은 캐치. Dimitar에게 감사드립니다! – Anurag

+0

show/hide에는 인수가 필요하지 않습니다. "0"을 제거하십시오. –

관련 문제