WebKit 브라우저에서 jQuery를 사용하여 .focus()하는 방법

Question

제목은 거의 그것을 설명합니다. 이것은 WebKit 관련 문제입니다 (FireFox가 전혀 문제를 제기하지 않았으므로 적어도이를 좁혔습니다). 이 문제는 Chrome 8.0.552.224 및 Safari 5.0.2에서 테스트되었습니다. 나는 그것이 이상 공중 선회하고이 집중되는 때 때 a.button에 클래스를 추가하는 jQuery를 기능을 만들었습니다

<li class="buttonArea"> <span class="buttonHighlight"></span> 
    <a href="#" class="button">PRE-ORDER</a> 
    <a href="#" class="buttonTag">Got a Coupon Code?</a> 
    <span class="buttonBG"></span> 
    <!-- Rainbow background --> 
</li> 

:

나는이 HTML 구조를 가지고있다. 방법은 다음과 같습니다.

$(document).ready(function() { /* ///// start DOM ready ///// */ 
    /** Big button hover/active effects **/ 
    $('a.button').hover(function() { 
     $(this).toggleClass('button-hover'); 
    }); 
    $('.button').focus(function() { 
     $(this).toggleClass('button-active'); 
     Cufon.replace('.button-active'); 
    }); 
}); /* ///// end DOM ready ///// */ 

버튼 호버 클래스가 추가되었습니다. 그러나 버튼 활성은 아닙니다. Cufon.replace 라인을 제거하더라도 작동하지 않습니다. 분명히 이미이 WebKit 관련 문제 (http://bugs.jquery.com/ticket/3332)를 언급 한 jQuery 사이트의 티켓이 있지만, 천재적인 마음으로 나를 도울 수 있기를 바랍니다. 이

$('.button').click(function() { 
    $(this).toggleClass('button-active'); 
    Cufon.replace('.button-active'); 
}); 

예에 의해

$('.button').focus(function() { 
    $(this).toggleClass('button-active'); 
    Cufon.replace('.button-active'); 
}); 

클릭 이벤트와 포커스 이벤트를 교체하고 (너무 크롬에서) 유사하게 작동합니다 클릭도 만족하기 때문에 -

Answer 1

어쨌든 좋은 친구 덕분에 약간의 조정을 통해 해결책을 찾았습니다. 이것은 브라우저 간 호환이며 다른 사용자에게 도움이되기를 바랍니다.

$('.button').hover(function() { 
    $(this).addClass('button-hover'); 
    $(this).mousedown(function() { 
     $(this).addClass('button-active'); 
     Cufon.replace('.button-active'); 
     $(this).mouseup(function() { 
      $(this).removeClass('button-active'); 
      Cufon.replace('.button'); 
     }); 
    }); 
}, function() { 
    $(this).removeClass('button-hover'); 
}); 

Answer 2

잘 난 당신의 코드를 대체 할 수 있다고 생각 귀하의 요구 사항에 초점을 귀하의 경우에서 무엇을 기대합니다.