jQuery 문제 : 호버, UN-Hover 작동하지 않습니다

Question

나는 문제가 있습니다. 이것은 내 웹 사이트입니다 http://keironlowe.x10hosting.com/탐색 표시 줄에서 움직이는 빨간색 선은 아래 코드 때문입니다. 그러나 그것은 의도 한대로 작동하지 않습니다. 내가 원하는 것은 빨간 선이 호버에서 더 길어지는 것입니다. 그러나 커서를 멀리 이동할 때 정상 크기로 돌아가지 만 제대로 작동하지 않으면 한 번만 작동하고 새로 고침해야하며 홈 링크에서 작동하지 않으며 더 길지 않고 작아집니다. 돕다?

<script type="text/javascript" src="jQuery.js"></script>
<script type="text/javascript">
$(document).ready(function() {
 $('div', '#nav_container').hover(function() {
    $(this).animate({width: '220px'}, 1000);      
}, function() {
    $(this).animate({width: '300px'}, 1000); 
});
});
</script>

Answer 1

전화 해보세요 .멈추다() 애니메이션 전에 :

$(document).ready(function() {
  $('div', '#nav_container').hover(function() {
    $(this).stop();
    $(this).animate({width: '220px'}, 1000);      
  }, function() {
    $(this).stop();
    $(this).animate({width: '300px'}, 1000); 
  });
});

편집하다: 포함 된 DIV 대신 이미지를 크기를 조정하려면. 이 시도:

$(document).ready(function() {
     $('#nav_container div').hover(function() {
        $(this).children('img').stop().animate({width: '220px'}, 1000);      
     }, function() {
        $(this).children('img').stop().animate({width: '300px'}, 1000); 
     });
});

원하는 효과를 얻으려면 너비와 지속 시간을 조정해야 할 수도 있습니다.

Answer 2

메이트를 고치기 쉽습니다.

스크립트 태그에 다음을 작성하십시오.

$(document).ready(function() {
        $('.box').hover(
          function() {
              $(this).css({ background: 'blue' });
          },
          function() {
              $(this).css({ background: 'black' });
          }
        );
    });

그리고 다음 마크 업을 작성하면 호버가 당신에게 미소를 지어야합니다.

<div class="box"></div>

Answer 3

죄송합니다. 언급하는 것을 잊었습니다. jQuery에 여러 선택기를 쓰는 것은 비슷합니다

( 'selector1, selector2, ...')

실수로 다음과 같이 썼습니다.

$ ( 'div', '#nav_container'). hover (function () {....

도움이 되었기를 바랍니다