[JQUERY] 그것의 jQuery CSTE 연구진 및 호버를 사용할 수 있습니까?

그것의 jQuery CSTE 연구진 및 호버를 사용할 수 있습니까?

해결법

1. ---

   1.(당신이 (CSTE 연구진은 사용해야 할 경우 자바 스크립트로 채워 요소)이 답변의 마지막 편집 봐)

   (당신이 (CSTE 연구진은 사용해야 할 경우 자바 스크립트로 채워 요소)이 답변의 마지막 편집 봐)

   자바 스크립트를 사용하여 채워지지 않습니다 요소에 대해이 옵션을 사용합니다 :

   $(".selector").on("mouseover", function () {
       //stuff to do on mouseover
   });
   

   .hover ()가 그것 자신의 핸들러는 다음과 같습니다 http://api.jquery.com/hover/

   여러 일을하려면, 그래서 같은 CSTE 연구진 () 핸들러에서 그들을 체인 :

   $(".selector").on({
       mouseenter: function () {
           //stuff to do on mouse enter
       },
       mouseleave: function () {
           //stuff to do on mouse leave
       }
   });
   

   당신이 아래에 제공된 답변에 따르면) (CSTE 연구진은 가져가 사용할 수 있지만 :

   또한, 거기를 사용하는 성능에 장점은없고 그냥 mouseenter이나하는 MouseLeave를 사용하는 것보다 더 부피입니다. 내가 제공 한 대답은 적은 코드를 필요로하며, 같은 것을 달성하기 위해 적절한 방법입니다.

   편집하다

   이 질문에 대답 한 이래로 동안이었다 그리고 약간의 견인을 얻은 것으로 보인다. 위의 코드는 여전히 유효하지만, 나는 내 원래의 대답에 뭔가를 추가 할 않았다.

   내가 mouseenter와하는 MouseLeave CSTE 연구진 (와 (나 코드에서 세드릭을 이해하는 데 도움))를 사용하여 선호하지만 그것은) (그냥 가져가와 다음을 작성하는 것과 동일

   $(".selector").hover(function () {
       //stuff to do on mouse enter
   }, 
   function () {
       //stuff to do on mouse leave
   });
   

   원래의 질문이 제대로 가져가 ()와 ()에 사용할 수있는 방법을 물어 않았기 때문에, 나는에의 사용을 () 수정 것이라고 생각하고 필요시 호버 () 코드를 추가 할 찾을 수 없습니다.

   편집 2012년 12월 11일

   문제의 사업부는 자바 스크립트를 사용하여 채워 경우 세부 아래에 제공된 일부 새로운 답변 CSTE 연구진은 () 작동 방법. 예를 들어, 당신과 같이, jQuery의 .load () 이벤트를 사용하여 사업부를 채울 가정 해 봅시다 :

   (function ($) {
       //append div to document body
       $('<div class="selector">Test</div>').appendTo(document.body);
   }(jQuery));
   

   CSTE 연구진에 대한 위의 코드는 () 서하지 않을 것입니다. 대신 다음과 같이 약간의 코드를 수정해야합니다 :

   $(document).on({
       mouseenter: function () {
           //stuff to do on mouse enter
       },
       mouseleave: function () {
           //stuff to do on mouse leave
       }
   }, ".selector"); //pass the element as an argument to .on
   

   이 코드는 .load () 이벤트가 일어난 후 자바 스크립트로 채워 요소에 대해 작동합니다. 그냥 적절한 선택에 당신의 인수를 변경합니다.

2. ---

   2.문서가 질문 요청으로로드 된 후 만든 개체에서 / 마우스를 올려 놓으면 때 이러한 솔루션 중 어느 것도 나를 위해 일하지 않는다. 이 질문은 오래지만 여전히 찾는 사람들을위한 솔루션을 알고 :

   문서가 질문 요청으로로드 된 후 만든 개체에서 / 마우스를 올려 놓으면 때 이러한 솔루션 중 어느 것도 나를 위해 일하지 않는다. 이 질문은 오래지만 여전히 찾는 사람들을위한 솔루션을 알고 :

   $("#container").on('mouseenter', '.selector', function() {
       //do something
   });
   $("#container").on('mouseleave', '.selector', function() {
       //do something
   });
   

   문서 이후이 셀렉터와 그 객체가 여전히 전화를 할 수있을 것입니다 준비 이렇게하면 셀렉터 기능을 결합합니다.

3. ---

   3.내가 간섭이 있다면 말할 수 없습니다, 그래서 나는 확실히 당신의 자바 스크립트 외모의 나머지가 무엇을 좋아 아니에요. 그러나 .hover () CSTE 연구진과 이벤트로 잘 작동합니다 ().

   내가 간섭이 있다면 말할 수 없습니다, 그래서 나는 확실히 당신의 자바 스크립트 외모의 나머지가 무엇을 좋아 아니에요. 그러나 .hover () CSTE 연구진과 이벤트로 잘 작동합니다 ().

   $("#foo").on("hover", function() {
     // disco
   });
   

   당신이 이벤트를 활용 할 수있게하려면, 이벤트에서 반환 된 객체를 사용합니다 :

   $("#foo").on("hover", function(e) {
     if(e.type == "mouseenter") {
       console.log("over");
     }
     else if (e.type == "mouseleave") {
       console.log("out");
     }
   });
   

   http://jsfiddle.net/hmUPP/2/

4. ---

   4.그냥 웹에서 서핑 내가 기여할 수 느꼈다. 나는 위의 코드는 @calethebrewer에 의해 게시와 함께 예를 들어, 선택 및 예기치 않은 동작을 통해 여러 번 호출 될 수 있습니다 것으로 나타났습니다 : -

   그냥 웹에서 서핑 내가 기여할 수 느꼈다. 나는 위의 코드는 @calethebrewer에 의해 게시와 함께 예를 들어, 선택 및 예기치 않은 동작을 통해 여러 번 호출 될 수 있습니다 것으로 나타났습니다 : -

   $(document).on('mouseover', '.selector', function() {
      //do something
   });
   $(document).on('mouseout', '.selector', function() {
      //do something
   });
   

   이 바이올린 http://jsfiddle.net/TWskH/12/ 내 지점을 illustraits. 그러한 플러그인의 요소로서 애니메이션 언제 이러한 다중 트리거가 더 이상 필요하다라는 애니메이션 또는 코드를 당할 수도 의도하지 않은 동작이 발생할 것을 발견 하였다.

   나의 제안은 단순히 mouseenter /하는 MouseLeave로 대체하는 것입니다 : -

   $(document).on('mouseenter', '.selector', function() {
      //do something
   });
   $(document).on('mouseleave', '.selector', function() {
      //do something
   });
   

   이 호출되는 내 애니메이션의 여러 인스턴스를 방지 비록 부모의 아이들이 이상 공중 선회 될 때 결정하기 위해 필요에 따라, 나는 결국 마우스 오버 /하는 MouseLeave와 함께 갔다.

5. ---

   5.jQuery를 호버 기능은 마우스 오버와로 마우스 기능을 제공합니다.

   jQuery를 호버 기능은 마우스 오버와로 마우스 기능을 제공합니다.

   $(".item-image").hover(function () {
       // mouseover event codes...
   }, function () {
       // mouseout event codes...
   });
   

   출처 : http://www.w3schools.com/jquery/event_hover.asp

6. ---

   6.당신은 당신이 추가 정보 섹션의 말씀 수행하여 호버로) (CSTE 연구진은 사용할 수 있습니다 :

   당신은 당신이 추가 정보 섹션의 말씀 수행하여 호버로) (CSTE 연구진은 사용할 수 있습니다 :

   즉, 다음을 수행하는 것입니다 :

   $("#foo").on("hover", function(e) {
   
       if (e.type === "mouseenter") { console.log("enter"); }
       else if (e.type === "mouseleave") { console.log("leave"); }
   
   });
   

   EDIT (jQuery를 1.8 이상 사용자를위한 참고 사항) :

7. ---

   7.

   $("#MyTableData").on({
   
    mouseenter: function(){
   
       //stuff to do on mouse enter
       $(this).css({'color':'red'});
   
   },
   mouseleave: function () {
       //stuff to do on mouse leave
       $(this).css({'color':'blue'});
   
   }},'tr');
   

8. ---

   8.당신은 공백으로 구분 된 하나 개 또는 여러 이벤트 유형을 제공 할 수 있습니다.

   당신은 공백으로 구분 된 하나 개 또는 여러 이벤트 유형을 제공 할 수 있습니다.

   그래서 호버 mouseenter하는 MouseLeave 같습니다.

   이것은 나의 제안이다 :

   $("#foo").on("mouseenter mouseleave", function() {
       // do some stuff
   });
   

9. ---

   9.당신은 그것이 다른 이벤트의 조건으로 가질 필요가 경우에, 나는 이런 식으로 해결 :

   당신은 그것이 다른 이벤트의 조건으로 가질 필요가 경우에, 나는 이런 식으로 해결 :

   $('.classname').hover(
        function(){$(this).data('hover',true);},
        function(){$(this).data('hover',false);}
   );
   

   그리고 또 다른 경우에, 당신은 쉽게 사용할 수 있습니다 :

    if ($(this).data('hover')){
         //...
    }
   

   (:이 문제를 해결하기 위해) 그러나 이것은) 아직 유효한 jQuery를 선택하지 (과 호환되는 모든 브라우저에서 작동하지 않는 '가져가'를 내가 (일부 사용은 참조하십시오.)

10. ---

    10.JQuery와 플러그인 hoverIntent http://cherne.net/brian/resources/jquery.hoverIntent.html는 여기에 나열된 순진한 접근 방식보다 훨씬 더 간다. 그들은 확실히 작업하는 동안, 그들은 반드시 사용자가 기대하는 방법을 작동하지 않을 수 있습니다.

    JQuery와 플러그인 hoverIntent http://cherne.net/brian/resources/jquery.hoverIntent.html는 여기에 나열된 순진한 접근 방식보다 훨씬 더 간다. 그들은 확실히 작업하는 동안, 그들은 반드시 사용자가 기대하는 방법을 작동하지 않을 수 있습니다.

    hoverIntent를 사용하는 가장 강력한 이유는 타임 아웃 기능입니다. 그것은 당신이 일을 사용자가 약간 오른쪽으로 너무 멀리 마우스를 드래그하거나 원하는 항목을 클릭하기 전에 남아 있기 때문에 폐쇄에서 메뉴를 방지하고자 수행 할 수 있습니다. 또한 집중 호버링에 대한 공세의 이벤트 대기를 가져가 활성화하지 않는 기능을 제공합니다.

    사용 예 :

    var config = {    
     sensitivity: 3, // number = sensitivity threshold (must be 1 or higher)    
     interval: 200, // number = milliseconds for onMouseOver polling interval    
     over: makeTall, // function = onMouseOver callback (REQUIRED)    
     timeout: 500, // number = milliseconds delay before onMouseOut    
     out: makeShort // function = onMouseOut callback (REQUIRED)
    };
    $("#demo3 li").hoverIntent( config )
    

    이것 또한 explaination는 https://stackoverflow.com/a/1089381/37055에서 찾을 수 있습니다

from https://stackoverflow.com/questions/9827095/is-it-possible-to-use-jquery-on-and-hover by cc-by-sa and MIT license