雨ならばrainyday.jsで窓ガラスを伝う雨や、ripples.jsで水面に水滴が落ちる様子を描画するプラグインで表現ができます。
そこで、晴れや曇りを表現できるものがないかなー、と探してみた次第。
晴れ
イメージとしては日差しがキラキラしている感じ。これだ、というのは難しいですが、要素に光沢がキラリと走るエフェクトはあったのでこれで表現できないかなー、と。
曇り
- Three.js の雲のサンプルを試してみるテスト – jsdo.it – Share JavaScript, HTML5 and CSS
- デジタル・フロンティア-Digital Frontier | DF TALK | [WebGL入門] javascriptを使って3Dプログラミングをやってみる
今回一番衝撃的だったのはこれ。three.jsというWebGLをサポートしたライブラリで雲海を描画するというもの。マウス移動で方向まで動くとか…。でも重そう…。
雨
- [JS]リアルさが想像以上!ブラウザのウインドウを窓に喩えて、雨を楽しむ癒やし系スクリプト -rainyday.js | コリス
- 窓ガラス越しに雨を降らせるリアルなアニメーション『rainyday.js』
- ブラウザに雨を降らすことができるrainyday.jsを使ってみたよ! | the Saibase
- [JS]エフェクトの美しさがスゴイ!Webページを水面にし、波紋を生み出すスクリプト -jQuery Ripple | コリス
- リアルな波紋を画像上で作るjquery.ripples.jsの使い方 | CreativeTips
雨は冒頭の通り2+1つをピックアップ。
で、雨や水滴に関する3つのスクリプトを組み合わせて「THE・雨」というサンプルページを作ってみました。
たぶんIEはダメだと思います。