|

30 scripts para galerías, presentaciones y lightboxes

ByLuis

Una gran colección de scripts que nos ayudarán a incluir nuestras galerías de fotos, presentaciones y lightboxes. 30 scripts en total, organizadas por:

  • Galerías y lightboxes en Ajax.
  • Galerías de imágenes basadas en Ajax.
  • Galerías CSS+Javascript.

De las 30 me gustaría destacar unas cuantas que son las que más me han gustado:

  • JonDesign’s SmoothGallery : usando mootools v1.0 para su desarrollo, se trata de un script de tan solo 16k, que añade fade, transparencias, thumbnails, vistas preliminares y todo ello con un diseño muy sencillo y llamativo.galeria1.png
  • Couloir.org: otra galería de imágenes en forma de presentación, con fade, redimensionamiento de la ventana y sonido.galeria2.png
  • Lightbox2: uno de los mejores y de los más conocidos, transparencias, fade y posibilidad de navegar entre las diferentes imágenes.galeria3.png
  • TripTracker: muy parecido a los anteriores, en este caso permite también acceder a la primera y última y enviar por email la ruta de la imagen en cuestión.galeria4.png
  • Cross Browser Multi-Page Photograph Gallery: Increible galería basada totalmente en CSS de la que ya hemos hecho referencia anteriormente, pero que siempre merece una mención.galeria5.png

30 Scripts For Galleries, Slideshows and Lightboxes

Similar Posts

|

Cinco consejos sobre CSS

ByLuis

Cada cual tiene su forma de desarrollar y todo aquel que considera que su experiencia puede ser de utilidad, da consejos sobre cómo poder hacer las cosas. Nunca viene mal aprender de otros, por eso os muestro 5 consejos que nos ofrece Mike Rundle.

  • Organiza tus estilos según el siguiente formato: primero reune las que correspondan a los contenedores y layouts, después las cabeceras (<h1>..<h6>), seguido iría los párrafos y los enlaces, y por último todas las listas (navegación, …).
  • No uses estilos por defecto, en vez de crear un estilo para todos los enlaces (<a>), defínelo contenido por bloques (por ejemplo: #contenido a {..}).
  • Utiliza etiquetas HTML para incluir estilos dentro de otros estilos, por ejemplo, si queremos que una línea tenga distintos colores, en vez de usar capas y clases, define estilos para etiquetas tipo <em> para que quede un código más limpio.
  • En vez de usar capas con un estilo definido, usa etiquetas HTML que representen la misma función que quieres mostrar, por ejemplo, en vez de usar una capa para el título, usa una etiqueta de cabeceras (<h1>..<h6>). No reinventes la rueda.
  • Nombra los estilos según su funcionalidad, no como aparecen, en vez de crearte un estilo llamado rojo, create uno que se llame error, cuando es precisamente un error lo que quieres mostrar.

My 5 CSS Tips
Vía / SkimCSS

|

Transparent Borders with background-clip

ByLuis

Have you ever seen an element on a page with transparent borders? I think Facebook originally popularized it giving birth to lightbox plugins like Facebox. I don’t think Facebook sports the look anymore, but it’s still rather neat. You might think it would be as simple as this:#lightbox { background: white; border: 20px solid rgba(0,0,0,0.3); }Howe …

Post original

| | |

CSSVista: editor CSS para Firefox e IE6

ByLuis

CSSVista es una aplicación desarrollada por la gente de SiteVista que nos permite editar CSS y ver los resultados que se producen directamente en IE6 y Firefox.
cssvista.png
Se trata de una aplicación gratuita, todavía en fase de desarrollo que nos puede ser de gran utilidad cuando maquetamos un diseño y queremos que se vea correctamente en ambos navegadores. Aunque yo prefiero usar un editor normal y refrescar el contenido en el navegador que esté probando en ese momento.
CSSVista
Vía / Lifehacker

|

HTML Purifier: filtro HTML en PHP

ByLuis

htmlpurifier.pngHTML Purifier es un filtro HTML para PHP que no solo elimina código XSS, sino que asegura que tus HTML cumplan los estándares.
A parte admite configurar el filtro con una serie de parámetros, pudiendo decir si se quiere que sea XHTML Strict o Transitional, HTML o XHTML, indicar el nivel de filtro.
HTML Purifier
Vía / dzone

Añadir estilos y scripts a la administración de plugins en WordPress

ByLuis

Cuando estamos desarrollando un plugin para WordPress y queremos que la administración del plugin tenga estilos y scripts propios, ya sea para darle cierta interactividad o diseño, o bien podremos incluir los estilos o librerías a pelo en la página del plugin, o bien podremos hacer que WordPress añada lo estilos y los scripts en el head del HTML. Para realizar esto, deberemos utilizar las acciones admin_print_styles y admin_print_scripts:

add_action('admin_print_styles', 'incluir_css');
add_action('admin_print_scripts', 'incluir_script');

function incluir_css() {
  echo '';
}

function incluir_script() {
  echo '';
}

Así de sencillo.

| | |

Cambiar el tamaño de letra dinámicamente

ByLuis

font-size de Elmundo.es

Leyendo esta entrada sobre el uso de botones para cambiar el tipo de letra de forma dinámica, se nos ha ocurrido contar cómo poder hacerlo.

Se puede hacer de varias formas: incrementando o decrementando el tamaño de letra según se pulse en los botones de aumentar o reducir el tipo de letra, o de forma fija, aumentando el tamaño de la letra y disminuyéndolo, pero solo a unos tamaños prefijados.

Read More “Cambiar el tamaño de letra dinámicamente”