테스트 사이트 - 개발 중인 베타 버전입니다

반응형 웹에서 제이쿼리 이벤트 전환 채택완료

denny 9년 전 조회 4,590

<script type="text/javascript">

$(function(){

var gnbHd = $('.gnbHd');

gnbHd.find('>ul>li>ul').hide();

gnbHd.find('>ul>li>a')

.mouseover(function(){

gnbHd

.find('>ul>li>ul:visible')

.slideUp(200)

.parent('li')

.removeClass('active')

.find('>a')

.css('fontWeight','');

$(this)

.next('ul:hidden')

.slideDown(200)

.parent('li')

.addClass('active')

.find('>a')

.css('fontWeight','bold');

})

.focus(function(){

$(this).mouseover();

})

.end()

.mouseleave(function(){

gnbHd

.find('>ul>li>ul')

.slideUp(200)

.prev('a')

.css('fontWeight','');

});

});

</script>

상단메뉴바의

메뉴가 가로형에서 모바일 사이즈 800px일때  버튼형 메뉴로 전환시 

이벤트를 mouseover에서 click으로 변경할수 있나요? 방법을 알려주시면 감사하겠습니다.

 

댓글을 작성하려면 로그인이 필요합니다.

답변 2개

채택된 답변
+20 포인트
9년 전

unbind로 mouseover를 해제하고 bind로 click 이벤트를 등록하면 될 것 같네요. 

로그인 후 평가할 수 있습니다

댓글을 작성하려면 로그인이 필요합니다.

a
9년 전

이렇게 하면 어떨까요.

 

</p><p>jQuery(function($) {
 var onCB = function(e) {
  //뭔가 한다.
 }
 var offCB = function(e) {
  //뭔가 한다.
 }
 var responsive = function(width) {
  var $target = $('#target').off().focus(onCB);
  if (width == 800) {
   $target.click(onCB);
  } else {
   $target.hover(onCB, offCB);
  }
 }
 $(window).resize(function(e) {
  responsive($(this).width());
 })
 responsive($(window).width());
});</p><p>
 

로그인 후 평가할 수 있습니다

댓글을 작성하려면 로그인이 필요합니다.

답변을 작성하려면 로그인이 필요합니다.

로그인