Si, ya entendí. Si cargo la imagen para el menu primario, queda en memoria, y el menú secundario la tiene ya servida, y no necesita conectarse al servidor. Ergo, no hay tiempo de espera. Genial!
Ahora estoy sin ganas de editar los .png, así que usé un div con position absolute, y con una serie de spans que cargan todas las imagenes que necesito. El div está fuera de pantalla así que la única función que cumple es "precargar" los .ong
Muchas gracias David! Estuve tres meses sin resolver esto.
Este es el codigo:
Cita: <div id="iris">
<span class="dos"></span>
<span class="tres"></span>
<span class="cuatro"></span>
<span class="cinco"></span>
<span class="seis"></span>
<span class="siete"></span>
<span class="ocho"></span>
</div>
Cita: /* background images */
#menu ul li.uno ul,#menu ul li.uno li a {}
#iris span.dos,#menu ul li.dos ul,#menu ul li.dos li a {background: url(../filtros/azul.png) repeat}
#iris span.tres,#menu ul li.tres ul,#menu ul li.tres li a {background: url(../filtros/dorado.png) repeat;}
#iris span.cuatro,#menu ul li.cuatro ul,#menu ul li.cuatro ul li a {background: url(../filtros/v.20/rosa.png) repeat}
#iris span.cinco,#menu ul li.cinco ul ,#menu ul li.cinco ul li a {background: url(../filtros/blanco.png) repeat;}
#iris span.seis,#menu ul li.seis ul ,#menu ul li.seis ul li a {background: url(../filtros/verde.png) repeat}
#iris span.siete,#menu ul li.siete ul,#menu ul li.siete li a {background: url(../filtros/naranja.png) repeat}
#iris span.ocho,#menu ul li.ocho ul ,#menu ul li.ocho li a {background: url(../filtros/violeta.png) repeat}
#iris span{
padding: 8px;
position: absolute;
top: -100px
}