skuare.net

JavaScriptライブラリjQueryのサンプルを中心にWebサイト構築に役立つ情報を紹介

画像をパズルっぽく表示しちゃうJavaScript「snapfit.js」

画像をこんな風に見せたら、ユーザーに印象を与えることができます(?)。
snapfit.jsは画像をパズルっぽく表示してくれます。

sponsors

使用方法
snapfit.jsからsnapfit.jsをダウンロードします。
<script type="text/javascript" src="snapfit.js"></script>
あとは画像を以下のように記述するだけでOKのお手軽仕様です。
<amp-img onload="snapfit.add(this);" src="画像パス" />
※ダブルクリックで回転、altとダブルクリックでX軸に反転、shiftとダブルクリックでY軸に反転
またオプションは以下のように記述します。
6lt;amp-img onload="snapfit.add(this,{aopacity:0.0001, mixed:true,aborder:true, aimage:true, polygon:true, space:20});" src="画像パス" />
画像をパズルっぽく表示しちゃうJavaScript「snapfit.js」サンプル

sponsors

「画像をパズルっぽく表示しちゃうJavaScript「snapfit.js」」をシェアする

記事作成:
記事URL:

TOP > > > 画像をパズルっぽく表示しちゃうJavaScript「snapfit.js」

前の記事:
次の記事:ポロライド写真をばら撒いたように表示するギャラリーJavaScript「Polaroid Photo Viewer」

JavaScript

read more

Column

read more