Another thread

[Tumble]

<style>

 .flag { width:350px; height:150px; position:relative; }
 .flag img { position:absolute; left:0; top:0; display:block; }
 
</style>


<div class="flag">  
 <img src="http://placehold.it/350x150/ff0" />
 <img class="bw" src="http://placehold.it/350x150/" />  
</div>
<script class="jsbin" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script>
   $(function() {
      $('.flag').hover(
         function () {
             $(this).children('.bw').first().fadeOut('slow');
          },
         function () {
             $(this).children('.bw').first().fadeIn('slow');
          }
       );
   });
</script>xx

[Tumble]

<style>
.fadeIn {
       border:5px solid #c9c9c9;
       margin:15px;
       -webkit-box-shadow: 0px 0px 5px #333;
       -moz-box-shadow: 0px 0px 5px #333;
       -ms-box-shadow: 0px 0px 5px #333;
       -o-box-shadow: 0px 0px 5px #333;
       box-shadow: 0px 0px 5px #333;

     
       opacity:0;
       -webkit-animation:fadeIn ease-in 1;
       -moz-animation:fadeIn ease-in 1;
       -o-animation:fadeIn ease-in 1;
       animation:fadeIn ease-in 1;
       -webkit-animation-fill-mode:forwards;
       -moz-animation-fill-mode:forwards;
       -o-animation-fill-mode:forwards;
       animation-fill-mode:forwards;
}


.fadeIn-3s {
       -webkit-animation-duration:3s;
       -moz-animation-duration:3s;
       -o-animation-duration:3s;
       animation-duration:3s;
}

.fadeIn-5s {
       -webkit-animation-duration:5s;
       -moz-animation-duration:5s;
       -o-animation-duration:5s;
       animation-duration:5s;
}


.fadeIn-Delay-3s {
       -webkit-animation-delay:3s;
       -moz-animation-delay:3s;
       -o-animation-delay:3s;
       animation-delay:3s;
}

.fadeIn-Delay-5s {
       -webkit-animation-delay:5s;
       -moz-animation-delay:5s;
       -o-animation-delay:5s;
       animation-delay:5s;
}


@-webkit-keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
@-moz-keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
@-o-keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
@keyframes fadeIn { from { opacity:0; } to { opacity:1; } }


</style>

[Tumble]

<style>
#picOne, #picTwo {
position:absolute;
display: none;
}
#picOne{position:absolute;top:2px; right:10px;height:100px; width:60px;}

</style>







<script type="text/javascript">
$(document).ready(function() {
   $('#picOne').fadeIn(1500).delay(3500).fadeOut(1500);
   
});
</script>


[Tumble]

xxx