Jquery 롤오버 페이드

Question

누군가이 코드를 도와 줄 수 있는지 알고 싶습니다. fadeIn/fadeOut으로 불투명도 전환을 추가하고 싶습니다. 나는 이미 혼자하려고하지만 그래서 그것을 성공하지 않는 :(

가 대단히 감사합니다 jQuery를에 초보자 해요!

하는 코드

에게

<script type="text/javascript"> 
    $(document).ready(function() { 
     $('img.article01').hover(function() { 
      this.src = 'imgColor.jpg'; 
     }, function() { 
      this.src = 'imgGray.jpg'; 
     }); 
    });  
</script> 

jQuery를

ssss

img { 
    max-width: 100%; /*very important*/ 
} 

.figure { 
    width: 100%; 
} 

.thumbTitle { 
    position: absolute; 
    font-size: 1em; 
    padding-left: 25px; 
    color: #fff; 
} 

,

HTML을

<article class="padding"> 

    <h2 class="thumbTitle">Project 01</h2> 

    <div class="figure"> 
     <a href="projet01.html" class="thumb"> 
      <img src="imgGray.jpg" class="article01" /> 
     </a> 
    </div> 

</article> 

Answer 1

HTML :

<div id="mainDiv">Hover here 
    <div id="div1" style="width:80px;height:80px;display:none;background-color:red;"></div> 
</div> 

스크립트 :

$(document).ready(function(){ 
    $("#mainDiv").hover(function(){ 
    if($("#div1").css("display") == "none"){ 
     $("#div1").fadeIn(2000); 
    }else{ 
     $("#div1").fadeOut(2000); 
    } 
    }); 
}); 

이것은 fadeIn 및 fadeOut 효과를 전환됩니다. 이것이 도움이되기를 바랍니다. 작동 fiddle here