user1235147

I have a simple image menu. There is a background-image which disappears on hover to show the menu items. I am looking for jQuery solution to fade out this image slowly. Any ideas?

HTML:

<div id="m1">
    <ul class="joomla-nav">
         <li>...</li>
    </ul>
</div>

CSS:

#m1 {
background-image:url('../images/m1.jpg');
width:320px;
height:210px; 
background-color:#1F91B7;
float:left;}

#m1:hover {
background-image:none;
background-color:transparent}

#m1:hover .joomla-nav {
display:block!important; }

#m1 .joomla-nav {
display:none!important; }

Many thanks!