画面の下に池を作り景色を映して揺らすJavaScript-qlake.js

画面の下に波打つ池を作り景色を映すJavaScript-qlake.js

jqueryのlake.jsを改造して、JavaScriptだけで画面に波を起こすようにしました。Ｗｉｎｄｏｗｓ７～８．１のＩＥ１１、Ｃｈｒｏｍｅ、Ｆｉｒｆｏｘ、タブレットのｉＯＳのｉＰａｄ、Ａｎｄｒｏｉｄ　Ｎｅｘｃｕｓ７とうで動くことが確認できました。
ソース
<html lang="ja"> <head> <meta charset="shift_jis"> <meta http-equiv="X-UA-Compatible" content="IE=edge/"> <title>qlake</title> </head> <body> <script> ur = "./"; //写真の置き場 file = "lake.jpg";//写真 waves = -20; //波の数（＋－は波の方向) speed = 0.5; //波の速さ scale = 0.3; //波の振幅 lake = 80; //池の大きさ（画面の％）（小さいほど準備時間が短い） </script> <script src="https://qpon-toyota.com/jquery/lake/qlake.js" charset="shift_jis"></script> </body> </html> 個人のサイト場合はqlake.jsを直リンクで使用して結構です。ダウンロードする時は↑を右クリックして取り込んでください参考にしたサイト：jQuery lake.js

jqueryのlake.jsを改造して、JavaScriptだけで画面に波を起こすようにしました。
Ｗｉｎｄｏｗｓ７～８．１のＩＥ１１、Ｃｈｒｏｍｅ、Ｆｉｒｆｏｘ、
タブレットのｉＯＳのｉＰａｄ、Ａｎｄｒｏｉｄ　Ｎｅｘｃｕｓ７
とうで動くことが確認できました。

ソース


<html lang="ja">
<head>
<meta charset="shift_jis">
<meta http-equiv="X-UA-Compatible" content="IE=edge/">
<title>qlake</title>
</head>
<body>
<script>
ur    = "./";      //写真の置き場
file  = "lake.jpg";//写真
waves = -20;        //波の数（＋－は波の方向)
speed = 0.5;       //波の速さ
scale = 0.3;       //波の振幅
lake  = 80;	   //池の大きさ（画面の％）（小さいほど準備時間が短い）

</script>
<script src="https://qpon-toyota.com/jquery/lake/qlake.js" charset="shift_jis"></script>

</body>
</html>

個人のサイト場合はqlake.jsを直リンクで使用して結構です。
ダウンロードする時は↑を右クリックして取り込んでください

参考にしたサイト：jQuery lake.js

他の揺れソース