VintageJS - это jQuery-плагин, который использует элемент HTML5 Canvas, чтобы добавить винтажный стиль для ваших фотографий. Он включает в себя три встроенных эффекта и может быть очень легко настроен.
Чтобы использовать vintageJS вам необходима библиотека jQuery и браузер, который поддерживает элемент HTML5 Canvas. Вы можете настроить эффекты путем добавления различных опций при вызове vintageJS. VintageJS был протестирован в следующих браузерах:
Вначале Вам необходимо подключить к странице библиотеку jQuery, скрипт vintageJS и стили vintageJS (см. исходники на github.com):
<script src="src/jquery.js"></script> <script src="src/vintage.js"></script> <link rel="stylesheet" type="text/css" href="css/vintagejs.css" media="all" />
Следующий шаг, это добавление событий для фотографий, к которым необходимо применить ретро-эффект. В этом примере мы будем использовать событие click:
$(function () { $('img.vintage').click(function () { $(this).vintage(); }); });
Вот и все! Теперь добавьте изображение с классом «vintage» на вашу HTML-страницу и нажмите на него, чтобы увидеть результат.
Вы можете изменить эффект путем добавления опций при вызове vintageJS.
Если вы хотите изменить стили на ваши собственные, то следующими настройками можно управлять:
Вот как может выглядеть пользовательский вызов:
$(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 }); }); });
Новый комментарий