Hola amigos: lo que quiero es acer un efecto de intercambio de imagen lento con jquery a mi menu: lo he colgado en miarroba para que lo vean:
http://mimenu.webcindario.com/
como pueden ver el menu funciona pero quiero que la imagen cambie lentamente al pasarle el puntero ensima!!!
es decir quiero que el efecto quede como este menu que encontre en google:
http://www.shopdev.co.uk/blog/menuDemo.html
Mi codigo en Index.html es este:
Cita: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Documento sin título</title>
<style type="text/css">
ul#menu{
margin:auto;
list-style-type:none;
background:url(img/bgnav.jpg);
height:42px;
width:974px;
}
#menu li {
text-align:center;
font-size:105%;
float:left;
width:132px;
height:42px;
text-align:center;
line-height:40px;
}
#menu li:hover{
background:url(img/nacvinactivo.jpg);
}
#menu li.activa {
background:url(img/nacvactivo.jpg);
}
</style>
</head>
<body>
<ul id="menu">
<li class="activa"><a href="index.html">Inicio</a></li>
<li><a href="post.html">Posts</a></li>
<li><a href="tutoriales.html">Tutoriales</a></li>
<li><a href="registrate.html">Registrarse</a></li>
</ul>
</body>
</html>
Como quedaria mi codigo incluyendo la libreria de Jquery y el codigo del efecto!!! gracias amigos