Cómo expandir miniaturas como las imágenes de Google
Google Images ejecuta una interfaz de usuario única con vistas previas en miniatura de muchos sitios web diferentes. Al hacer clic en cualquiera de estas miniaturas se expande la pantalla con más detalles y una imagen más grande..
Es una de las mejores funciones de galería de imágenes que he usado y ahora, Puedes clonarlo con Gridder.js.
Este complemento gratuito de jQuery sigue los pasos de la increíble UX de Google creando un complemento que coincida con este efecto. Usted puede Convierte cualquier galería de fotos en una galería de estilo Google Images Con todas las mismas animaciones y características de visualización..
Estoy gratamente sorprendido por la velocidad y la facilidad de uso que viene con este complemento. Simplemente haciendo clic en cualquier miniatura inmediatamente muestra un disparo más grande y las animaciones son super limpias.
Las imagenes Incluye una sección para texto descriptivo. En caso de que desee agregar algunos detalles o enlaces relacionados con las fotos. Esto funciona especialmente bien para sitios de portafolio simples con el objetivo de enfocarse en las imágenes.
Además de eso, puedes También tira contenido a través de Ajax. Esto te permite crear miniaturas dinámicas que extraen contenido de otros sitios web o a través de APIs.
Cada evento clic ofrece un método de devolución de llamada, por lo que incluso puede ejecutar otros complementos o funciones de JavaScript junto con Gridder. Con tantas opciones, prácticamente se siente como un marco de cuadrícula completo!
Desde Gridder corre en jQuery, requiere la versión más reciente como una dependencia. Pero, eso es todo lo que necesita (junto con el archivo Gridder.js), y con unas pocas líneas de HTML, puede hacer que su cuadrícula funcione sin problemas.
Debes revisar la página de GitHub para instrucciones completas de configuración pero aquí hay un vista previa rápida de cómo se ve el HTML:
Todo el contenido se tira a través de JavaScript, para que puedas cargar casi todo lo que quieras.
Es un complemento increíblemente versátil con opciones para cambie la velocidad de animación, la aceleración, el estilo del botón de cierre y la posición de desplazamiento de desplazamiento para cuando el usuario hace clic en una nueva miniatura.
Tanto los principiantes como los desarrolladores profesionales encontrarán mucho valor en este complemento. Sin embargo, si aún no estás seguro de si esto es para ti, echa un vistazo a la página de demostración de Gridder en vivo y juega..