pre-cargar imagen
Publicado por Fede (1 intervención) el 08/01/2011 02:45:56
Qué tal, necesitaba una ayudita con un detallecito que le quiero dar a mi página
Tengo un menú de botones, cada uno de los cuales consiste en un <div> con una imagen de fondo. La idea es que cuando el mouse pasa por encima del botón la imagen cambie para que el botón luzca "seleccionado".
Hasta ahí bien, ya lo hice sencillamente a través de dos funciones:
// Cambia el estilo de una menú item para que luzca seleccionado.
function cambiarAMenuItemSeleccionado(menuItemLink) {
menuItemLink.parentNode.style.backgroundImage = "url(plantilla/img/menu_item_seleccionado.png)";
}
// Cambia el estilo de una menú item para que luzca no seleccionado.
function cambiarAMenuItemNoSeleccionado(menuItemLink) {
menuItemLink.parentNode.style.backgroundImage = "url(plantilla/img/menu_item_no_seleccionado.png)";
}
El problema es que la PRIMERA VEZ que esto pasa (el mouse pasa por encima del botón) por un instante (hasta que la imagen alternativa se carga) no se muestra ninguna imagen. Las siguientes veces no hay problema porque el recurso ya fue cargado.
La pregunta es: hay alguna forma de cargar el recurso ANTES de que la función sea invocada por primera vez? El inconveniente que se me presenta es que a backgroundImage sólo se le puede asignar un url , o me equivoco?
Tengo un menú de botones, cada uno de los cuales consiste en un <div> con una imagen de fondo. La idea es que cuando el mouse pasa por encima del botón la imagen cambie para que el botón luzca "seleccionado".
Hasta ahí bien, ya lo hice sencillamente a través de dos funciones:
// Cambia el estilo de una menú item para que luzca seleccionado.
function cambiarAMenuItemSeleccionado(menuItemLink) {
menuItemLink.parentNode.style.backgroundImage = "url(plantilla/img/menu_item_seleccionado.png)";
}
// Cambia el estilo de una menú item para que luzca no seleccionado.
function cambiarAMenuItemNoSeleccionado(menuItemLink) {
menuItemLink.parentNode.style.backgroundImage = "url(plantilla/img/menu_item_no_seleccionado.png)";
}
El problema es que la PRIMERA VEZ que esto pasa (el mouse pasa por encima del botón) por un instante (hasta que la imagen alternativa se carga) no se muestra ninguna imagen. Las siguientes veces no hay problema porque el recurso ya fue cargado.
La pregunta es: hay alguna forma de cargar el recurso ANTES de que la función sea invocada por primera vez? El inconveniente que se me presenta es que a backgroundImage sólo se le puede asignar un url , o me equivoco?
Valora esta pregunta
0
