마우스가 링크 위로 이동 한 후 HTML 하이퍼 링크가 변경된 채로 남아 있습니다.

Question

궁금한 점은 마우스를 마우스로 가리키면 파란색으로 바뀝니다. 마우스가 사라진 후 몇 초 후에 파란색으로 유지할 수 있습니까? 이게 jquery로 가능할 것 같아요? 감사!

Answer 1

대안은 CSS 전환-duration 속성 수 있습니다. 이렇게하면 지정된 시간 동안 단색이 유지되지 않지만 예를 들어 한 색상에서 다른 색상으로 전환 할 때 초 단위가 소요될 수 있습니다. 이것은 페이지를 방문하는 일부 브라우저에서 지원되지 않을 수 있으므로 jQuery를 사용하여 다른 답변을 작성하는 것이 좋습니다.

a { 
    color: red; 
    transition-duration: 5s; 
    -moz-transition-duration: 5s; 
    -webkit-transition-duration: 5s; 
} 

a:hover { 
    color: blue; 
} 

Answer 2

확실!

$('#myLinkId').hover(
    function(e){ 
    //mouseover 
    $(this).css('color','blue'); 
    }, 
    function(e){ 
    //mouseout 
    $(this).animate({color:'black'},300); //300 is the speed of the animation in ms 
    } 
); 

애니메이션 문서 : http://api.jquery.com/animate/

Answer 3

demo

CSS

a { 
    color: red; 
} 

a.blue { 
    color: blue; 
} 

HTML이 링크가 페이드 아웃하려는 경우, 당신은 색상을 애니메이션 jQuery를 UI가 필요합니다

<a href="index.html">home</a> 

jQuery를이

$(document).ready(function(){ 
    $('a').hover(function(){ 
     $(this).addClass('blue'); 
    }, 
    function(){ 
     var link = $(this); 
     setTimeout(function(){link.removeClass('blue');},1000); 
    }) 
}) 

demo