使い方
リンク先はデモも用意されていたり日本語だったりなので、そちらを見てもらった方が確実だと思いますが。。
html
<div class="js-morphing"> <img src="img/01.jpg" alt=""> </div>
JavaScript
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script src="../jquery.morphing.js"></script>
<script>
$(function(){
$('.js-morphing').morphing({
numVert: 6, //円の粒度
spring: 0.005, //バネ運動の動作数値
friction: 0.90, //摩擦運動の動作数値
radius: 80, //Canvasの表示半径
fps: 45
});
});
</script>
オプションもいろいろ設定できるようです。
Canvasを使用しているのでブラウザはhtml5対応以上ですね。
なかなか面白いですね。
