當您懸停文字時淡入圖像

Question

您不知道如何編寫函數，以便當您將鼠標懸停在圖片或文字上時，淡入淡出圖像。 http://jsfiddle.net/Tiimsvk/8mwh03fr/

<script> 
 
function showimg1(img){ 
 
    obr=document.getElementById('showingimg1'); 
 
    obr.src=img; 
 
    return false; 
 
} 
 
</script> 
 
<a href="#"><img src="http://lumainterier.eu/image/interier/schodiska/scale/003D.jpg" onmouseover="return showimg1('http://lumainterier.eu/image/interier/schodiska/scale/003C.jpg');" onmouseout="return showimg1('http://lumainterier.eu/image/interier/schodiska/scale/003D.jpg');" id="showingimg1"></a> 
 
<a href="#" onmouseover="return showimg1('http://lumainterier.eu/image/interier/schodiska/scale/003C.jpg');" onmouseout="return showimg1('http://lumainterier.eu/image/interier/schodiska/scale/003D.jpg');">RODINNÉ DOMY</a>

Answer 1

<script> 
 
function showimg1(img){ 
 
    obr=document.getElementById('showingimg1'); 
 
    obr.src=img; 
 
    return false; 
 
} 
 
</script> 
 
<style> 
 
    #image{ 
 
//define all of the transitions, to make the animation smooth 
 
-webkit-transition:1s; 
 
-moz-transition:1s; 
 
transition:1s; 
 
} 
 

 
#image:hover{ 
 

 
opacity:0.8; // fade the opacity to a subtle lower value 
 

 
    } 
 
</style> 
 
<a href="#"><img class="image" src="http://lumainterier.eu/image/interier/schodiska/scale/003D.jpg" onmouseover="return showimg1('http://lumainterier.eu/image/interier/schodiska/scale/003C.jpg');" onmouseout="return showimg1('http://lumainterier.eu/image/interier/schodiska/scale/003D.jpg');" id="showingimg1"></a> 
 
<a href="#" onmouseover="return showimg1('http://lumainterier.eu/image/interier/schodiska/scale/003C.jpg');" onmouseout="return showimg1('http://lumainterier.eu/image/interier/schodiska/scale/003D.jpg');">RODINNÉ DOMY</a>

當我通過文字或圖片