programming/mobile web

[mobile web] jquery mobile a tag hover 흉내내기

labj 2013. 2. 20. 10:27

[mobile web] jquery mobile a tag hover 흉내내기


모바일에서 jquery mobile을 사용하면서 PC웹의 hover와 비슷하게 구현하는 방법에 대해서 구현해 보았습니다. 

처음 $(function() {...});에서 메뉴영역에 대해서 jquery mobile의 tap 이벤트를 bind 하여

터치로 메뉴를 선택하면 a 영역의 색깔이 바뀌도록 합니다.

이벤트 적용 바로 다음에 setTimeout을 주어서 a 영역의 색깔을 원래대로 바꾸는 함수를 호출하는 것입니다. 

간단하게 적용이 가능 할 것으로 보입니다.


$(function(){
    $(".comment li a").bind("tap", function(event) {
        $(".comment li a").addClass("test1");
        setTimeout('removeTapClass()', 200);
    });
});


function removeTapClass() {
    $(".comment li a").removeClass("test1");
}



<div class="usedu_menu_container">
    <div class="usedu_menu_content">
        <div class="comment">
            <ul>
                <li onclick="javascript:myEduList();"><a>메뉴1</a></li>
            </ul>
        </div>
    </div>
</div>



[mobile web] jquery mobile a tag hover 흉내내기