2012-03-20 5 views
0

페이지 하단에 고정되어있는 바닥 글을 유지하려고 할 때 마우스가 지나가고 페이드 아웃되면 페이드 아웃됩니다. 이 작업을 얻을 수 있습니다 :바닥 글 페이드 인/아웃

http://jsfiddle.net/PDeqM/

HTML

<footer> 
Footer stuff 
</footer>​ 

CSS :

footer { 
    position: fixed; 
    bottom: 0px; 
    display: none; 
    background: #000; 
    width: 100%; 
    height: 50px; 
    color: #fff 
}​ 

Jquery

$("footer").hover(
      function(){ 
       $(this).fadeIn(100); 
      }, 
      function(){ 
       $(this).fadeOut(100); 
      } 
);​ 

답변

0

숨겨진 경우 마우스를 가져갈 수 없습니다. 불투명도를 사용해보십시오 :

$("footer").css({'opacity':0}).hover(
    function(){ 
     $(this).animate({'opacity':1},100); 
    }, 
    function(){ 
     $(this).animate({'opacity':0},100); 
    } 
);​ 

http://jsfiddle.net/PDeqM/6/

0

fadeOut() 그것이 끝에서 사라지게 실행과 같이, 불투명도,하지의 가시성을 애니메이션합니다.

이 코드는 작동합니다

$('footer').hover(function() { 
    $(this).stop().animate({ 
     opacity: 1 
    }, 100); 
}, function() { 
    $(this).stop().animate({ 
     opacity: 0 
    }, 100); 
}).css('opacity', 0);​ 

데모 : 대신 디스플레이의 http://jsfiddle.net/PDeqM/8/