VintageJS es un plugin jQuery que utiliza Canvas de HTML5 para agregar a cualquier fotografía un bonito efecto vintage. El plugin cuenta con tres efectos distintos que se pueden personalizar muy fácilmente.
Este plugin tiene como dependencia a jQuery, actualmente funciona con la ultima versión. Ademas, y como es de esperarse, necesita de un navegador que soporte el elemento HTML5 canvas.
VintageJS fue correctamente testeado en:Mozilla FireFox 3.16.14, Google Chrome 9.0.597.107, Safari 5.0.3, Opera 11.01 e Internet Explorer 9.
Efecto Vintage con jQuery + HTML5:
1. Añadimos las bibliotecas y hojas de estilo necesarias a nuestro proyecto:
<script src="src/jquery.js"></script> <script src="src/vintage.js"></script> <link rel="stylesheet" type="text/css" href="css/vintagejs.css" media="all" />
2. Inicializamos el plugin con una configuración basica:
<script> $(function () { $('img.vintage').click(function () { $(this).vintage(); }); }); </script>
El plugin se encuentra diseñado de tal manera que podamos configurar todos los aspectos gráficos mediante la utilización de parámetros, un buen ejemplo de ello es el código que inserto a continuación en donde podrán ver perfectamente lo completo que es este fantástico recurso.
<script> $(function () { $('img.vintage').click(function () { $(this).vintage({ vignette: { black: 0.8, white: 0.2 }, noise: 20, screen: { red: 12, green: 75, blue: 153, strength: 0.3 }, desaturate: 0.05 }); }); }); </script>
Web: VintageJS
danideu
13 años ago
He intentado utlizarlo, pero la imagen se queda LOADING y no termina de cargar. De hecho en los archivos que vienen al descargar el plugin, si intentas probar la demo (documentation/index.html), tampoco cargan.
¿sabes que puede pasar?. ¿Te ha llegado a funcionar?
Saludos,