画像をヴィンテージ加工してしまうjQueryプラグイン「vintageJS」

画像をヴィンテージ加工してしまうjQueryプラグイン「vintageJS」サンプル 画像を格好良く見せたいというのはサイト運営者の常です。
rendro/vintageJSを利用すれば、画像をヴィンテージ風に加工してくれます。

使用方法 rendro/vintageJSからファイル一式をダウンロードします。
<link rel="stylesheet" href="vintagejs.css" />
<script type="text/javascript" src="jquery-1.7.2.min.js"></script>
<script type="text/javascript" src="vintage.js"></script>
<script type="text/javascript">
$(function(){
$('.vintage').vintage();
});
</script>

上記を書いたら後は画像にclass名を付与すれば完成です。
<img src="画像パス" class="vintage" />
デフォルトでもいい感じに加工してくれますが、細かくカスタマイズすることも可能です。
$(function(){
$('.vintage').vintage({
vignette: { //ぼかし
black: 0.8,
white: 0.2
},
noise: 20, //ノイズ
screen: { //レイヤー
red: 12,
green: 75,
blue: 153,
strength: 0.3
},
desaturate: 0.05 //フィルター度合い
});
});

画像をヴィンテージ加工してしまうjQueryプラグイン「vintageJS」サンプル

sponsors

「画像をヴィンテージ加工してしまうjQueryプラグイン「vintageJS」」をシェアする

記事作成:
記事URL:

TOP > > > 画像をヴィンテージ加工してしまうjQueryプラグイン「vintageJS」