Cuando se cargan las imágenes de una página, estas quedan almacenadas en el caché. Por lo tanto, si una de ellas se utiliza en otras páginas no será requerida al servidor para ser cargada de nuevo. Por ello, siempre que se pueda, es conveniente repetir la misma imagen para los botones, los íconos, las barras de separación, etc.
Buenos Aires
Argentina
Nacido en el tercer mundo. Un santo varón. Buenos Aires. Los elefantes. Las golondrinas de Plaza de Mayo. Me chupo el dedo.
El tiempo es veloz. ¿No ves que ya no somos chiquitos? Despedida de la infancia. Todo es efímero. Juguetes perdidos. Dime quién me lo robó. Aprendizaje.
Soy un hippie. Rutas argentinas. Sobredosis de TV. Raros peinados nuevos. Más de cien mentiras. Delirium tremens.
Ciudad de pobres corazones. El karma de vivir al sur. Mundo de quimeras. Oh Dios, ¿Qué puedo hacer?
Cuando era más joven. Los mayores del mundo. Botas locas. Rejas electrificadas. Cerca de la revolución. Contra todos los males de este mundo. La casa desaparecida. Tumbas de la gloria. Vencedores vencidos. Carguen, apunten, fuego. Estás frito angelito. A lo mejor aún te acuerdas.
Ah, te vi entre las luces. Muchacha. Amor se llama el juego. Juego de seducción. Mi genio amor. Prométeme que nunca me dirás adiós. Pequeñas delicias de la vida conyugal. Toda la vida tiene música hoy. Es hora de levantare, querido (dormiste bien?).
Resumiendo.
Mi sueño de hoy. La sed verdadera. La búsqueda de la estrella. Todos juntos. ¡Ah! Basta de pensar.
Esto es to-to-todo amigos.
| CONTRAER ARCHIVOS |
|
23 comentarios:
Utilísima como siempre. Gracias.
Gracias Charly, espero que te ayude. Sirve para cualquier tipo de imagen que tengamos oculta.
Está muy bien pero ¿dónde conseguimos una imagenOver casi idéntica a la imagen normal para que produzca el efecto del ejemplo?
Si mal no recuerdo, las dos imágenes del botón del ejemplo las hice con alguno de los servicios que recomendabas en tu blog. Estoy casi seguro que era ESTE POST :)
De no ser ese, hay otros sitios donde se generan botones con imágenes y efectos over.
Estás en lo cierto, esa página proporciona imágenes over, pensaba que quizás había alguna otra que no conozco ;)
Hola, me llamo Joaquín,
Y quisiera agradecer vuestro trabajo, porque en concreto esto me ha servido de mucho, es lo que estaba buscando una solución inteligente rápida y que no dependa de la arquitectura del usuario.
Gracias y un saludo.
Me alegro que te fuera útil Joaquín :)
Hola JMiur me gustaría que me ayudaras con el menú de categorías que tengo en la barra lateral de mi blog, porque he intentado lo que dices pero no me sale, espero me puedas ayudar. Mi blog es http://educandomimente.blogspot.com.
Dextertp:
Aclareme un poco que es lo que no logras hacer porque lo veo funcionando muy bien.
Mira es que pasa que cada que abro mi blog y pongo el cursor sobre un botón, empieza a cargar para que aparezca la imagen y quisiera que las cargara antes de poner el mouse sobre el botón, para que no se vea lento.
Aquí te dejo un ejemplo de como hice un botón en html:
--- < a href="javascript:void(0);" onclick="expandcollapse('Educacion_Mental')" >< img border="0"
onmouseover="this.src=img='http://img143.imageshack.us/img143/8058/educa******.png';" src="http://img373.imageshack.us/img373/3562/educaci******.png" onmouseout="this.src='http://img373.imageshack.us/img373/3562/educacio*****.png';"/ >< /a>< br/ >
< ul id="Educacion_Mental" class="texthidden" >
< li >< a href="http://educandomimente.blogspot.com/2008/10/texto-clsico-acerca-de-la-conducta.html" target="_self">Un texto clásico acerca de la conducta< /a >< /li >. ---
Coloqué el código < style type="text/css" > .preload {display: none;}< /style > antes de < /skin >
y < img class="preload" src="URL_imagenNormal" width="ancho" height="alto" / > < img class="preload" src="URL_imagenOver" width="ancho" height="alto" / > antes de /body, pero esto lo repetí varias veces con la url de cada botón pero al parecer no es así, ojala puedas ayudarme y gracias.
*Pongo espacio a "< >" por causas de edición, pero van juntos.
Lo que has hecho está bien. Veamos otras alternativas. La idea general es cargar las imágenes y no mostrarlas para que estén disponibles antes. Una posibilidad entonces es hacer lo mismo pero, en lugar de ponerlo a l final, ponerlo al inicio, justo después de <body>
<img class="preload" src="URL_imagenNormal" width="ancho" height="alto" / >
etc...
Será lo mismo, quedarán ocultas pero, en teoría, se cargarán al principio de la página.
La segunda opción si esto no funciona, es recurrir al método tradicional, el script que se coloca antes de </head> Ese es el métodoque uso en el efecto que está aquí abajo y que muestra una animación en Hacia Atras Home etc.
La tercera opción y la que más me gusta, la uso en la sidebar y sól orequiere de una imagen, es una opción válida y funcionará siempre (VER aquí y aquí)
Hola gracias por contestar tan oportunamente, tengo otra duda, es que sin lugar a dudas no soy programador ha'.
Si utilizo el script:
img1 = new Image();
img2 = new Image();
img1.src = "URL_imagenNormal";
img2.src = "URL_imagenOver";
en mi caso como pongo esta secuencia si son varias imagenes que tengo que cargar
No sé si sea así, o como:
img1 = new Image();
img2 = new Image();
img3 = new Image();
img4 = new Image();
img1.src = "URL_imagenNormal";
img2.src = "URL_imagenOver";
img3.src = "URL_imagenNormal";
img4.src = "URL_imagenOver";
????
Gracias.
Exacto, tal como lo has puesto. El orden de las imágenes no importa. Lo único importante es que cada una tenga un nombre distinto, img1, img2, img3, etc.
Hola JMiur lo vuelvo a molestar, había hecho el script tal como le mostré, solo que a la hora de guardar, pasa lo siguiente
En vez de que quede con comillas así
img2.src = "http://img143.imageshack.us/img143/8058/educacio***.png";
Estas se transforman en código ASCII si no me equivoco
img2.src = "http://img143.imageshack.us/img143/8058/educaci***.png"
Y pienso yo que eso podria ser lo que provoca que no funcione el script o ¿usted que opina?
perdón queda así
img2.src = "http://img143.imageshack.us/img143/8058/educacio***. png";
Estas se transforman en código ASCII si no me equivoco
img2.src = & quot;http://img143.imageshack.us/img143/8058/educaci***. png"& quot;
Sí, eso es así. Blogger transforma comillas simples y dobles lo cual, a veces, provoca problemas. Para que el script no cambie y sea entonces más sencillo de leer y entender, colócalo así:
<script type='text/javascript'>
//<![CDATA[
....... aqui el código del script .......
//]]>
</script>
Gracias JMiur por su paciencia y ayuda, felicidades por este espacio tan completo.
Saludos, Dextertp. Fue un placer :)
Espectacular, Aplausos :D clap, clap!
Acababo de descubrir hace un dia o dos el efecto rollover, soy muy novato, y lo implemente en algo asi como un blog donde enlazo a todos mis blogs y me di cuenta de esto, de que tardaba mucho y no quedaba bien... pero con esto cambio 100% hasta tardan menos en cargar las imágenes Normales.
Lo mas curioso es que esto lo encontré por tu post de transiciones y no porque lo haya buscado :P, bueno gracias por ayudar a los novatos como nosotros.
Jmiur te quisiera hacer un par de preguntas, solo por curiosidad,contestalas si queres ahi van.. ¿tienes algun otro blog?¿eres estudiante? (no encontré tu perfil de blogspot para ver eso :P)¿el blog lo tienes solo por compartir, pasar el rato de una forma util, para expresar tu ego?(como yo xD)¿cuantos años tienes :X?
BUeno creo q me pase son bastantes jej
Para el que quiera ver el efecto andando dejo la direccion donde lo implemente
http://expresandome.com.ar
Saludos.. ya te sigo por feedburner y te voy a estar robando cosas jeje..
Me alegro que sirviera y contestaré lo que pueda :D
¿Otro blog? Oficialmente, este.
¿Estudiante? No. ¿Edad? Demasiada y por eso la respuesta a la pregunta anterior fue no ;)
¿El blog lo tienes solo por compartir, pasar el rato de una forma util, para expresar tu ego? Difícil de contestar pero no es para ayudar ni compartir (no fue pensado así) si eso ocurre es sólo casualidad y nada premeditado. Pongo lo que me interesa sin pensar mucho más que en pasarla bien. Es UN JUEGO; si alguien se une al juego, mejor :D
jaja :$ me emocioné demaciado rapido, me cegó la emoción.. emm.. no era tan lindo como yo pensaba, lo que ocurrió es que probé con otro navegador que casi no uso y tenia las imagenes ya cargadas en la caché porque habia entrado antes xD...no es tan rapido..
Tengo una duda,donde se ubica el .preload dentro de la platilla?
La precarga siempre depende del acceso a las imágenes y en eso, los navegadores difieren.
La mejor técnica para evitar esas demoras en los efectos es utilizar la técnica descipta en este otro post ya que no se usan dos imágenes sino una sola comn lo cual, el resultado es instantáneo.
hoola esta muy buena grax che si te gusta el reggaeton
pasate si qeres a mi blog http://www.joako-musica.tk
grax por la opcion GOOD BYE
¿Quiere dejar un comentario?
recuerde que los comentarios están siendo moderados y serán publicados a la brevedad ...
Nota: sólo los miembros de este blog pueden publicar comentarios.
Si le gusta ir a lo seguro utilice este botón para abrir los comentarios en una ventana modal en esta misma pagina.
Si añora tiempos idos, use este enlace para agregar un comentario al viejo estilo ...