2013-02-01 2 views
0

가능한 가장 간결한 방법으로 백본 이벤트에서 HoverIntent jQuery 플러그인을 사용하고 싶습니다. 여기 백본 응용 프로그램의 HoverIntent

은 (명확성을 위해 단순화) 이벤트입니다 : 기본적으로

events: 
'mouseenter'      : 'onMouseEnter' 
'mouseleave'      : 'onMouseLeave' 

onMouseEnter: -> 
    @$('.foo').show()  

onMouseLeave: -> 
    @$('.foo').hide() 

, 나는 herky - 육포를 보여주는를하지 않고 HoverIntent는 것 같다, 그래서 사람으로 숨어 페이지에서 마우스를 실행 잘 했어. 이미 프로젝트에 포함 시켰지만 갈 준비가되었습니다 ...하지만 백본보기에서 올바르게 호출하는 방법이 명확하지 않습니다. 제안?

답변

1

백본에서 사용할 수 있어야하는 사용자 지정 이벤트를 추가하는 여러 버전의 상형 문자가 있습니다. 다음을보십시오 : https://github.com/LeMisterV/jquery.hoverintent. mouseenterintentmouseleaveintent을 사용할 수 있어야합니다.

+0

감사합니다. 그 사건은 내가 필요로하는 것이었다! –

+0

나를 위해, 플러그인의 120 행에'TypeError : $ .event.handle is undefined'가 표시됩니다. 평범한 구형 'mouseenter'및 'mouseleave'로 잘 작동하지만 의도 한 부분을 작동시키지 못합니다. –

+0

http://stackoverflow.com/questions/16527658/jquery-error-typeerror-event-handle-is-undefined –

1

허용 된 답변의 플러그인이 더 이상 유지 관리되지 않으며 감가 상각 된 jQuery 함수를 호출합니다. 플러그인의 라인 120에서 $.event.handle.call(this.elem, this.event)$.event.dispatch.call(this.elem, this.event)으로 바꾸면 jQuery의 현재 버전에서 작동하도록 플러그인을 업데이트 할 수 있습니다.

그러나 호환성 문제를 패치 한 후에도 플러그인이 너무 이상하고 내 용도에 맞지 않는 것으로 나타났습니다. 대신, 내 mouseenter/mouseleave 콜백을 setTimeout 검사로 감싸서 hoverintent 기능 세트를 스푸핑하여 엘리먼트가 여전히 잡혀 있는지 확인합니다. 예를 들어 :

function eventCallback(){ 
    setTimeout(function() { 
     if ($(e.target).is(":hover")) { 
      //do your code 
     } 
    }, 100); 
} 

가 원하는대로 제한 시간에 타이머를 조정하고 사용자가 특정 지연 후 마우스를 계속하면 기능은 실행합니다.

관련 문제