터치 장치에서 호버 효과를 시뮬레이트하는 방법은 무엇입니까?

Question

나는 hover에서 css3 애니메이션이 포함 된 웹 페이지를 가지고 있으며 사용자가 이러한 요소를 터치 할 때 iPad 및 모든 터치 지원 장치에서 작동하도록하고 싶습니다.

HTML :

<div id="headBlock"> 
    <a id="arm"></a> 
    <div id="head"> 
     <div id="blink"></div> 
     <div id="lid"></div> 
     <div id="man"></div> 
     <a id="man-arm"></a> 
    </div> 
</div> 

JS :
여기 내 코드의

//arm 
$('#arm').hover(function(){ 
    $(this).removeAttr('style').css('bottom','244px'); 
    $(this).addClass('hover_effect'); 

    }, function(){ 
     $(this).removeClass('hover_effect'); 
}); 

//man arm 
$('#man').hover(function(){ 
    $('#man-arm').removeAttr('style'); 
    $('#man-arm').addClass('hover_effect'); 

    }, function(){ 
     $('#man-arm').removeClass('hover_effect'); 
}); 

당신은 마우스가 요소를 입력 할 때 다음 스타일을 제거 스타일을 적용하고 CSS를 추가하는 것을 볼 수있다 클래스 'hover_effect'및 마우스를 떠날 때 'hover_effect'클래스를 제거합니다.
어떻게하면 터치 장치에서 동일한 작업을 수행 할 수 있습니까? click 이벤트에는 콜백이 없으므로 클릭 후 'hover_effect'클래스를 제거 할 수 없습니다. mousedown과 mouseup을 시도했지만 작동하지 않았습니다. stackoverflow 검색 및이 How do I simulate a hover with a touch in touch enabled browsers? 찾았지만 어떤 효과가 없었어요.
아무도 아이디어가 없습니까?

감사
마우로

Answer 1

시도 $('#man').

Answer 2

또는 당신은 당신이 같은 효과를 원하거나 DIFF 사용하는 경우 같은 간다 a#man:hover{....} [같은 CSS에서 :hover 클래스를 추가 할 수 있습니다에 대한 유사이

$('#arm').bind('touchstart', function() { 
     $(this).removeAttr('style').css('bottom','244px'); 
     $(this).addClass('hover_effect'); 
}); 

$('#arm').bind('touchend', function() { 
     $(this).removeClass('hover_effect'); 
}); 

. diff의 색상이나 이미지. 결과].