Editor de .htaccess online

ByLuis

Buena herramienta que nos permite crear ficheros .htacces de forma online, muy útil para aquellos que no tienen conocimientos de Apache pero que necesitan modificar el .htaccess.
Mediante diferentes opciones y formularios, nos permite rellenar los datos necesarios para que nos vaya devolviendo el .htaccess final. Este editor nos facilita la labor a la hora de: no permitir el acceso a ficheros, autenticacion, páginas de error, páginas por defecto, redirecciones y restricción de accesos.
.htaccess Editor

Similar Posts

|

Mostrar iconos en los enlaces mediante Javascript

ByLuis

Hoy he visto en varios sitios cómo poner en los enlaces un icono del tipo de archivo al que se hace referencia. Algo parecido contamos hace ya tiempo, y al igual que en el ejemplo actual, no funciona para IE6, y aunque nos pese, aún hay muchas personas que siguen usando este navegador.

Una solución es realizarlo mediante Javascript, para lo cual tan solo deberemos incluir un pequeño script en nuestras páginas. El script tiene un array con expresiones regulares que detectan determinadas href y la url del icono para incluirlo en el estilo del enlace. Además existe una función que añade al evento onload del window una función que selecciona todos los enlaces, comprueba por cada enlace si cumple alguna de las expresiones regulares y si es así modifica el estilo con el icono correspondiente.

var listaiconos = new Array();
listaiconos[listaiconos.length] = new Array(/youtube\.com\/watch\?/, "icons/icon_film.gif");
listaiconos[listaiconos.length] = new Array(/sevenload\.com\/videos\//, "icons/icon_film.gif");
...
window.onload = function() {
var enlaces = document.getElementsByTagName("A");
for (var i=0; i<enlaces.length; i++) {
var ok = false;
for (var j=0; j<listaiconos.length && !ok; j++) {
if (enlaces[i].href.match(listaiconos[j][0])) {
enlaces[i].style.paddingRight = "20px";
enlaces[i].style.backgroundImage = "url("+listaiconos[j][1]+")";
enlaces[i].style.backgroundColor = "transparent";
enlaces[i].style.backgroundRepeat = "no-repeat";
enlaces[i].style.backgroundPosition = "right center";
ok = true;
}
}
}
}

Código

Vía / Intenta

| |

Frame: Modular CSS Framework

ByLuis

Frame is a modular CSS framework that supports: Layout, Typography, Forms, Code, Table, Reset, and Print styling. It is HTML5 compatible, and provides default styles and support for HTML5 elements. Frame is accompanied by an online tool that allows you to easily generate your own build (in case you don’t need to use all the features). …

Post original

|

Clipping de vídeo usando HTML5 y SVG en Firefox4

ByLuis

La verdad es que Firefox4 está de lujo, y las demos que ofrece Mozilla son increíbles. De una de ellas he sacado cómo hacer clipping en vídeos usando HTML5 y la posibilidad de incrustar SVG (sólo funciona en Firefox4).

El método es sencillo, tengo un SVG que muestra el contorno y los botones de play y pausa, además tiene un clipPath que se usará para el estilo clip-path del vídeo:

SVG

Vídeo

Javascript

var play = document.getElementById('play');
var pause = document.getElementById('pause');
var video = document.getElementById('video');
play.addEventListener('click', function() {
    play.style.display = 'none';
    pause.style.display = 'block';
    video.play();
  }, true);  
pause.addEventListener('click', function() {
    play.style.display = 'block';
    pause.style.display = 'none';
    video.pause();
  }, true);  
video.addEventListener("ended", function() {
    play.style.display = 'block';
    pause.style.display = 'none';
    video.pause();
  }, true);

El vídeo es el mismo que el de la demo de Mozilla, he puesto el borde semi-transparente para que se vea el clipping como va.

Demo

Vía / Project London Trailer

|

Recursos: BLUE VERTIGO

ByLuis

blue-vertigo.gif Con el paso de los años nos vamos acomodando y tendemos a confiar cuando buscamos material para el desarrollo de sitios en algunos pocos recursos de confianza ignorando un mar de posibilidades. Si estás en esta fase bien por vaguete o por desconocimiento de a dónde acudir…
Desde Argentina, directorio de fuentes y stock de imágenes organizadas por tipo y licencias, vectoriales, sonidos para usar en Flash, photoshop brushes, y mucho más:
BLUE VERTIGO

|

Scale-out vs Scale-up

ByLuis

In this post I'll cover the difference between multi-core concurrency that is often referred to as Scale-Up and distributed computing that is often referred to as Scale-Out mode.  more.. Source: Scale-out vs Scale-up (http://www.dzone.com/links/r/scaleout_vs_scaleup.html) by Nati Shalom …

Post original

24 ways: buenos trucos para tu web

ByLuis

24ways.png24 ways es un sitio a tener en cuenta a la hora de encontrar trucos y efectos para tu web desarrollados por gurus del desarrollo web.

En especial me han gustado cinco de ellos:

Vía / QuirksBlog