水面を表現するには

質問

http://ange-w.com/c.html
の右上の部分はカーソルが来ると水面のようになりますが、これを表現するにはどのソフトでどのようなことをすればいいでしょうか。フラッシュは使えます。よろしくお願いいたします。

回答No.1

noname#35109 · ベストアンサー

書かれているURLの水面の波紋は，
Flash ではありません。
Java Applet （Javaアプレット） で動いています。

ＷＷＷ講座～Java Applet 「Appletとは」
http://www.nurs.or.jp/~sug/html/chap73.htm#sec2

ちなみに，
JavaScript（Javaスクリプト） と Java Applet（Javaアプレット） は全然別物ですから，
混同しないように気を付けてください。
もし，この件の Java に関しまして，
他カテゴリで再質問されることがありました場合も，
カテゴリをお間違えないようにおねがいします。

ご質問で書かれているURLのページを開いて，
ブラウザ（インターネットエクスプローラ）のツールバーから，
「表示」→「ソース」を選択してもらうか，
もしくは，
書かれているURLのページを開いて，
写真などが何もないところを「右クリック」→「ソースの表示」を選択してもらうと，
そのページのソースコードを見ることができると思います。

そのゴチャゴチャ書いてあるコードの中に

<applet code="DropWater3D.class" width="321" height="141">
　　～ ～ ～ 略 ～ ～ ～
<!-- permission of 3D(ON/OFF) -->You need browser equipping Java.
</applet>

と書いてある部分があるのですが，
ここが水面のように動かしているものに関係している部分です。

上記のコードを見てもらうと，ほとんど答えが書いてあるのですが，
水面のような動きをさせるプログラムは，
「DropWater3D.class」 というJavaのクラスファイルです。

勘がある程度はたらく人だと，
ページの雰囲気とこの辺のソースの書き方などで，
Javaプログラムを作った方は URL のページを作られた方ではなく，
配布された Java の素材ファイルを使用しているということがわかります。
なぜわかるのかは，うまく説明できませんがとにかくわかるのです。
ここまでわかったら検索です。

検索：DropWater3D.class
http://www.google.co.jp/search?hl=ja&q=DropWater3D.class&lr=

上記のように検索してもらうとすぐにわかりますが，
（これまた，わかる人にはすぐわかるのですが，）
配布元のサイトさんはこちらです↓。

「WAKU WAKU JAVA」
http://hp.vector.co.jp/authors/VA012735/

上記サイトのこのページで配布されているものです↓。

「3D波紋Javaアプレット Ver.1.1a」
http://hp.vector.co.jp/authors/VA012735/applet/drop3D.htm

これ以上のことは，
私は Java が専門ではないのでよくわかりません。
上記ページでファイルをダウンロードさせてもらって，
それにに従ってするとできるのではないでしょうか。

私の環境ではなぜかダウンロードできません。
「DropWater3D.class」ファイルだけでしたら，
http://hp.vector.co.jp/authors/VA012735/applet/applet/
このページの，
「DropWater3D.class　　21-Dec-2004 17:16 10K」
をクリックしてダウンロードすることができました。

以上が，
Java Applet で正真正銘ご質問に書かれているサイトのようにする方法です。

＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝

> フラッシュは使えます。

ということなので，
Macromedia(Adobe) Flash をお持ちであり，
なおかつ，
その Flash がちゃんと使えるという前提で回答します。

上記 Java Applet とそっくりとは行きませんが，
同様なことをする方法をが次の URL に書いてあります。
他にも方法はあると思うので単なる一例です。

as - Flash ActionScriptネタなど
≫ 水面の波紋のようなエフェクト
http://as.otesei.com/item/206/catid/17

ダウンロードできる ZIPファイル内の Fla ファイルは，
一応 Flash MX 2004 以上であれば開くと思います。

挑戦してみてください。
私には難しすぎて，上記URLのようにはうまく説明できません。
また，ZIPファイルには，
「要望・質問・ご指摘などお気軽に.txt」も同封されています。
作られた方の方が細かい点などはよくわかると思います。

ちなみに，
フラッシュは使えると言うことなので，
おわかりになるかもしれませんが，
ダウンロードした ZIP ファイルを解凍したら出てくる，
「ripple.fla」のフレームスクリプトの最後の方↓，

-----------------------------
//クリックイベント（波紋を２つ作成）
main.onPress = function(){
var dep = _root.mask.getNextHighestDepth(); //利用可能な深度
para = { _x:this._xmouse, _y:this._ymouse, max_size:_root.main.pic1._width, _width:30, _height:30 };
_root.mask.attachMovie("ripple", "ripple" + dep , dep , para);
para = { _x:this._xmouse, _y:this._ymouse, max_size:_root.main.pic1._width, _width: 1, _height: 1 };
_root.mask.attachMovie("ripple", "ripple" + (dep + 1), dep + 1, para);
}
-----------------------------

この部分を次のように変えると，
なんとなく（あくまでもなんとなくです），
ご質問で書かれている Java applet に似たような感じになります↓。

-----------------------------
//onEnterFrameイベント（波紋を２つ作成）
var cnt = 0;
main.onEnterFrame = function() {
_root.cnt++;
if (_root.cnt%5==0) {
var dep = _root.mask.getNextHighestDepth();
//利用可能な深度
para = {_x:this._xmouse, _y:this._ymouse, max_size:_root.main.pic1._width, _width:30, _height:30};
_root.mask.attachMovie("ripple", "ripple"+dep, dep, para);
para = {_x:this._xmouse, _y:this._ymouse, max_size:_root.main.pic1._width, _width:1, _height:1};
_root.mask.attachMovie("ripple", "ripple"+(dep+1), dep+1, para);
}
};
-----------------------------

「ご質問で書かれている Java Applet とは似ていない」
と言われればそれまでですが，
似ていると言えば似ているような気がするのではないかと思います（？？？）。

以上が，
Java Applet を Flash で代用して，
ご質問に書かれているサイトのようにする，
つまり「モドキ」を作る１つの方法例です。

お礼

ありがとうございました。