Holas a todos. Hoy he querido compartir con ustedes una función Javascript que he logrado crear con el fin de realizar la tarea de ajustar la posición de un grupo de capas, de modo que queden todas pegadas, con un valor de margen determinado entre ellas.
Esta característica la quería aplicar en mis sitios web desde hacía tiempo, y lo había intentado aplicando la propiedad float:left al CSS de las capas, pero no era suficiente. Si bien en los primeros elementos se veía bastante bien la cosa, luego, cuando debían bajar, pues venía el desorden. En otro intento por acercarme al efecto deseado sin usar programación extra, le asigné a cada capa el mismo alto, de modo que al menos se vieran ordenadas hacia abajo. Pero esto no me convencía, y me di a la tarea de ver la manera de hacerlo con Javascript.
Y he aquí el resultado :D
Antes:
Después:
Pueden ver el código fuente para lograr este efecto en los siguientes enlaces: pero antes, por favor, ¡no borren los créditos! No espero que me mencionen en sus páginas como la autora de la función (si lo hacen, muchas gracias de antemano), pero al menos respeten mi trabajo manteniendo mis comentarios y créditos dentro del archivo Javascript! Gracias y ojalá les sirva!
Página de ejemplo: qAjustar.html
URL del archivo Javascript: qAjustar.js
Saludos!
PD: A la fecha, he aplicado esta funcionalidad en mi página El Baúl, por si la quieren ver en ejecución ^^.
Esta característica la quería aplicar en mis sitios web desde hacía tiempo, y lo había intentado aplicando la propiedad float:left al CSS de las capas, pero no era suficiente. Si bien en los primeros elementos se veía bastante bien la cosa, luego, cuando debían bajar, pues venía el desorden. En otro intento por acercarme al efecto deseado sin usar programación extra, le asigné a cada capa el mismo alto, de modo que al menos se vieran ordenadas hacia abajo. Pero esto no me convencía, y me di a la tarea de ver la manera de hacerlo con Javascript.
Y he aquí el resultado :D
Antes:
Pueden ver el código fuente para lograr este efecto en los siguientes enlaces: pero antes, por favor, ¡no borren los créditos! No espero que me mencionen en sus páginas como la autora de la función (si lo hacen, muchas gracias de antemano), pero al menos respeten mi trabajo manteniendo mis comentarios y créditos dentro del archivo Javascript! Gracias y ojalá les sirva!
Página de ejemplo: qAjustar.html
URL del archivo Javascript: qAjustar.js
Saludos!
PD: A la fecha, he aplicado esta funcionalidad en mi página El Baúl, por si la quieren ver en ejecución ^^.
Comentarios