es.hideout-lastation.com
Paraíso Para Los Diseñadores Y Desarrolladores


ZooMove: jQuery Plugin para acercar imágenes al pasar el mouse

Si alguna vez ha navegado por un sitio de comercio electrónico, es probable que haya visto el efecto de zoom de la imagen . Colocas una foto del producto y esa parte de la imagen se amplía para obtener una vista más clara .

El plugin ZooMove es una excelente manera de replicar este efecto en su sitio. Está alimentado por jQuery, por lo que puedes ponerlo en funcionamiento rápidamente sin mucho código.

ZooMove es completamente gratuito y de código abierto, disponible en GitHub para cualquier desarrollador curioso. Puede instalarse a través de npm, Bower, Yarn o descargarse directamente desde CDNJS .

Para configurar una imagen de ZooMove, necesitará tres archivos específicos en el encabezado de su página:

  1. jQuery
  2. ZooMove CSS
  3. ZooMove JS

Ambos archivos ZooMove se pueden minimizar si desea cargas de página más rápidas. También puede combinar el archivo CSS en su hoja de estilo principal si es más fácil.

Toda la magia real ocurre en el HTML donde puedes establecer data-* attributes de data-* attributes HTML5 data-* attributes para los diferentes efectos.

Esto le permite crear su propio efecto de zoom personalizado basado en cuatro parámetros diferentes:

  1. data-zoo-scale : define el tamaño total del zoom al desplazarse (ej. 2.0 para 200%)
  2. data-zoo-move : define si la imagen se mueve junto con el cursor
  3. data-zoo-over : define la imagen ampliada aparece sobre el original
  4. data-zoo-cursor - define el punto del cursor

Un quinto parámetro final le permite definir cuál debe ser la nueva URL de la imagen (si es necesario).

Puede usar ZooMove en todos los navegadores principales, incluido IE9 +. Este plugin es ampliamente compatible y ofrece una gran experiencia de usuario.

Si está buscando una biblioteca simple para desplazarse con el zoom, ZooMove es una excelente opción. Es lo suficientemente liviano para ejecutarse en cualquier sitio web y está impulsado por jQuery, por lo que no necesitará escribir tanto código para hacerlo funcionar.

Visite la página principal para verla en acción y consulte la documentación en GitHub para obtener más información.

Transición de número más suave con odómetro

Transición de número más suave con odómetro

Una de las maneras efectivas de hacer una presentación de información numérica más interesante es agregar una animación de transición . La creación de una animación de transición se puede hacer con javascript, pero la codificación le llevará mucho tiempo. Para una alternativa más rápida, prueba Odometer.Odometer es

(Consejos de tecnología y diseño)

20 diseños de muebles excepcionales para su inspiración

20 diseños de muebles excepcionales para su inspiración

Los diseñadores de muebles modernos tienden a crear muebles vívidos, multifuncionales y ahorradores de espacio que también se pueden transformar fácilmente en otra cosa. Por ejemplo, una cama que se puede convertir en un sofá, una silla o un puf, según sus necesidades.Somos una generación que adora maximizar el tiempo y el espacio, así que ¿por qué no obtener un escritorio que pueda usarse no solo para trabajar, sino también para dormir? En este p

(Consejos de tecnología y diseño)