HTML (3)


Templates de HTML con jQuery

Cuando el proyecto deja de ser algo sencillo, es importante empezar a pensar en separar la interfaz de la lógica, usar plantillas es el primer paso. Para cuando se necesita tener un sistema de plantillas, en el caso de javascript hay diferentes librerías que sirven para ello. Pero en este caso voy a hacerlo sólo con jQuery.




jQuery plugin: SameHeightElements

Hace un par de días tuve que hacer unos cambios en una web. Tenía que hacer que todos los elementos de una fila tuvieran el mismo alto, independientemente del contenido (en la imagen que hay más adelante se ve entiende mejor). La opción normalmente es usar display: table-cell; ó display: flex;, pero el resultado no siempre es el mejor y la compatibilidad con los navegadores tampoco. Así que hice un pequeño plugin para jQuery, lo apliqué en la web y después de ver que funciona bastante bien lo publiqué en Github.




HTML: Evitar selección de texto con CSS

Antes de nada, esto no sirve para Internet explorer. Y no me gustan esas páginas que vas a copiar un texto y no puedes, creo que esa actitud choca de forma directa con la filosofía intrínseca de la propia web; además de ser un par de puertas mal puestas en medio del campo ya que, si publicas un contenido sea en el formato que sea, se puede copiar y distribuir sin tu permiso, es mejor tenerlo asumido.

Por otro lado a veces por temas de interfaz y experiencia de usuario puede ser necesario, por ejemplo para botones usando la etiqueta A con , para eso existen estos atributos CSS. Un ejemplo de para qué puede ser util, se puede ver en la demo de mi plugin para jQuery: emm-select.

span.no_selection {
    -webkit-user-select: none;
    -moz-user-select: none;
    -khtml-user-select: none;
    -ms-user-select:none;
}