jQuery prevent flickering of child on hover

I'm having troubles when I hover an element and then hover an inside element. I don't know if its the best way to开发者_开发技巧 do what I'm trying to achieve. Here's my code:

My markup:

<div class="wrapper">  
   <div class="animation">  
     <a href="#" class="linked"><img src="#"/></a>  
     <h1 class="title hidden"><a href="#">blabla</a></h1>  
   </div>  
</div>

My js:

$('.animation a img').hover(function(){
        $(this).parent().next().stop().fadeTo("medium", 1);  
        $(this).stop().fadeTo("fast", 0);  
    }, function(){  
        $(this).parent().next().stop().fadeTo("medium", 0);  
        $(this).stop().fadeTo("fast", 1);   
    });  

CSS:

    #wrapper {margin: 0 auto; width: 960px;}
    #hidden {display: none;}
    h1 a {bottom: 0; float: left; font-size: 1.5em; left: 0; position: absolute; width: 460px;}
    .linked {background: #666; float: left; height: 250px;}

The flickering starts when I hover the H1. Is there any way to disable or fix it?

Thanks in advance!

It this what you want http://jsfiddle.net/GWHrK/2/

$('.animation a img').hover(function(){
        $(this).parent().next().stop().fadeTo("medium", 1);  
        $(this).stop().fadeTo("fast", .5);  
});