マウスオーバーやクリック時に拡大表示させたい。

質問

Flash素人の質問で恐縮です。

よく表現されていると思うのですが、ページ上に複数の小さいムービークリップが並べてあって、大きく見たいときに表示されているムービークリップをマウスオーバーした時に（又はクリック時）に拡大表示されるというようなことを実施したいと思っております。

this.xscale = this.yscale = 200 ;

当該のムービーのAction scriptに上記のScriptを記述したのですが、全く無反応です。

どのようにすれば、拡大表示されるのでしょうか？。

また、外部テキストを読み込んで、それをムービークリップに変換して上記の処理につなげるということは出来ますでしょうか？。

回答No.5

DPE · ベストアンサー

> 拡大画像が最前面に表示されるようにするには、どのようにしたら良いか教えて頂けますでしょうか？

Flash には深度（Ｚ値）という考え方があります。Ｚは３次元グラフィックでは奥行き方向の座標を表しますが、２次元のグラフィックでは重ね順の意味で使われることもあります。
Flash ではまさに重ね順の意味で使われていて、深度の小さいものほど上に重なるように描画されます。同じ深度が複数のオブジェクトに割り振られることはなく、同じレイヤーに配置されたオブジェクト同士であっても、深度は別の数値になります。
（同じレイヤーにあるオブジェクトが重なっている場合、どちらかが必ず上になって描画されるのはこのためです）
深度は、普段は数値として確認したり操作したりはできません。しかし、内部では数値で管理されていて、ActionScript ではこの深度を取得したり、深度を入れ替えて重ね順を動的に入れ替えることも可能です。

深度の取得は MovieClip.getDepth 、入れ替えには MovieClip.swapDepths というアクションを使います。
swapDepths は、深度の数値を指定してその深度を占有しているムービークリップと入れ替える方法と、ムービークリップのターゲット名を指定して、そのムービークリップと深度を入れ替える方法があります。
指定のムービークリップを１番上にする方法はいくつか考えられますが、ここではとりあえず、数値を指定して入れ替える方法をご紹介します。

スクリプトは次のように考えます。
まず、４つのムービークリップの深度を調べて、最も上になっているものの深度（つまり、最も小さい深度）を変数に保存しておきます。
ムービークリップの上にマウスカーソルが乗った時、拡大すると同時に、ムービークリップ自身の深度を、変数に保存してある深度（を持つムービークリップ）と入れ替えます。変数には４つの中で１番上になっているものの深度が保存されているのですから、この数値を持つムービークリップと深度を入れ替えると、１番上になって見えるという仕組みです。

４つのムービークリップで最も小さな深度を探す方法ですが。
eval というアクションを使うと、文字列や変数でムービークリップ等のインスタンス名を指定して、操作することができます。例えば、ムービークリップのインスタンス名を clip1 ～ clip4 というように通し番号で付けると、

　for( i = 1 ; i <= 4 ; i++ )
　{
　　eval( "clip" + i )._xscale = 200;
　}

このようにループを利用して、まとめて操作することもできます。今回も eval と for ループを使って、最も小さい深度を探します。
最も小さい深度を保存する変数を１つ、用意します。ここでは仮に、primary_depth という名前にします。
４つのムービークリップのインスタンス名を、先述の clip1 ～ clip4 とし、primary_depth の初期値はとりあえず、clip1 の深度を入れておきます。
残る clip2 ～ clip4 の深度を for ループを使って調べます。if 文で primary_depthの 値と比較して、primary_depth の値よりも小さかった場合は primary_depth の値を書き換えます。すると、 primary_depth には常に小さい方の値が入りますので、ループ終了後には最も小さい深度の値が保持されているというわけです。
スクリプトは、大体、次のようになります。このスクリプトは、タイムラインのフレームに設定してください。
（↓このスクリプトをコピーして利用する場合は、各行頭の全角のスペースを、全て半角のスペースかタブに置き換えてください。このまま使うとシンタックスエラーになります）

　//最小の深度を保持する変数
　//とりあえず clip1 の深度を初期値としていれておく
　primary_depth = eval( "_root.clip1" ).getDepth();

　//残りのムービークリップの深度と比較して
　//最小の深度を調べる
　for( i = 2 ; i <= 4 ; i++ )
　{
　　// clip2 ～ clip4 の深度を取得
　　temp = eval( "_root.clip" + i ).getDepth();

　　//深度が小さい場合は最小の深度を更新
　　if( primary_depth < temp )
　　{
　　　primary_depth = temp;
　　}
　}

あとは＃１の方が紹介されているアクションを、各ムービークリップのインスタンスに設定します。
ただし、ロールオーバー時の処理にもう１つ、深度を入れ替える処理を追加してください。
つまり、

　//ロールオーバー時に拡大、重ね順を１番上にする
　on(rollOver)
　{
　　//拡大処理
　　this._xscale = 200;
　　this._yscale = 200;

　　//重ね順を変更
　　this.swapDepths( _root.primary_depth );
　}

　//ロールアウト時に元に戻す
　on(rollOut)
　{
　　this._xscale = 100;
　　this._yscale = 100;
　}

変数の代入は、

　this._xscale = this._yscale = 200 ;

こう書いても文法上は問題ありませんが、スクリプトとしてはちょっと分かりにくいかも知れません。
this._xscale = ・・・などを列挙するのが見にくいのでしたら、with というアクションを使って

　with( this )
　{
　　_xscale = 150;
　　_yscale = 150;

　　swapDepths( _root.primary_depth );
　}

と、まとめて書くこともできます。

ActionScript の基本や各アクションの詳細は、市販の解説書や解説サイト・ヘルプ等をご参考になさってください。
長くなってすみませんでした。
不明な点がありましたら、補足してください。

お礼

DPEさん、

丁寧に解説して頂き誠にありがとうございます。
LOOP文のような操作がScriptで実装出来る事自体知りませんでした。
早速試してみます。

市販の解説書ですが、Scriptに特化した書籍は「Flash ActionScript Handbook 3rd edition」だけなんです。
良い書籍ですが、Scriptの素材集のような感じで、私のようなScriptを知りたいド素人には向いていないように感じます。お薦めの書籍がありましたらお教えください。

今後とも宜しくご教授ください。

回答No.7

DPE

＃５、６です。

＃５の件は問題ありませんでしたでしょうか。
＃６でも書きました通り、お間抜けな解説をしてしまいまして申し訳ありませんでした。「深度が小さいほど上」と説明しておきながら、スクリプトは「深度が大きいほど上」（正しくはこちら）として組んでいたとは、我ながら矛盾していますね。暑さでボケていたようです　^^;

私が ActionScript を勉強しはじめた頃にお世話になった解説書は、分かりやすくてオススメしたいところなのですが、Flash 5 の頃に刊行された本なので入手も難しいでしょうし、Flash MX や MX 2004 が主流になった今では、少々役不足でしょう。
申し訳ないのですが、最近の解説書についてはよく分かりません。別の質問を立てて回答を募った方が、いい情報が得られると思いますよ。

回答No.6

DPE

＃５です。

＃５の深度の話で、「深度の小さいものほど上」と書いてしまいましたが、「深度の大きいものほど上」の間違いでした。
スクリプトは間違いありません。コメントは違っているのですが、primary_depth と temp を比較して、大きい方を primary_depth に入れてますので。
この場をお借りしまして、お詫び・訂正させていただきます。
お間抜けな勘違いをしまして、大変失礼いたしました。

回答No.4

UNAHO

回答にならないかもしれませんが、
フレームの移動で処理ができるならアクションスプリクトでスケールを設定しなくても拡大した画像をそのままタイムラインに設置してはダメなのでしょうか？
スケールの値を動的に処理しなければいけないのであればこのては使えませんが、いかがでしょう？
それから、もし良かったら教えて欲しいのですが
this.xscale = this.yscale = 200 ;
この設定のやり方は問題ないのでしょうか？
動作するとしても下記のようにした方がよいと思うのですがどうなんでしょう？
this.xscale = 200 ;
this.yscale = 200 ;

回答No.3

amountainblast

こんにちは。

>お教え頂きました方法で、あるシンボルをマウスオーバーしたら別のフレームに飛んで、そこに設定してあるシンボルを拡大表示するようなことは可能でしょうか？。

これ自体は可能ですが、その場合はスクリプトが変わってきます。大変失礼ですが、どうもスクリプトの意味自体が分かっていないような気がいます。#1さんのスクリプトのon (rollOver) と言う意味は
このシンボルにマウスがrollOverしたら～という処理をしないさいと言う意味になります。
ですので、別のフレームに飛んだ地点でこのスクリプトは解除されてしまいます。
対策としてはフレーム１でマウスがロールオーバーしたらフレーム５に飛ぶ。
フレーム５が表示されたら、Ｘ２シンボルを拡大する。
といった流れでいいと思います。
但しフレーム５で記述するスクリプトはどのような処理をしたいかで変わりますけども・・・。

参考URL：

http://www12.plala.or.jp/llink/

補足

amountainblastさんのご指摘通り、Flashは全くのド素人で色んな意味が理解出来ていないのかもしれません。

＃１さんにお教え頂いた通りに実施しようと思いますが、同じレイヤーの同じフレームに、正方形を4等分したような
画像があるのですが、個々にScriptを記述して実行したところ、正しく拡大表示されますが、他の画像が被って表示されます。
拡大画像が最前面に表示されるようにするには、どのようにしたら良いか教えて頂けますでしょうか？。

回答No.2

GETSTREET

・何故「onClipEvent」って必要なんでしょうか？。　

この場合別に無くても構いません。

・必ず最初の大きさを記述する必要はありますか？。

この場合別に無くても構いません。

・拡大されるときの起点は変更出来ますか？。

シンボルの基準点によります。

・「loadVariables」でダイナミックテキストの変数に外部のテキストを読み込み、

これは不明、わかりません。

お礼

ありがとうございます。

まずは、当初の目的は達成出来ました。
感謝致します。今後も宜しくお願い致します。

teddy1014

補足

ありがとうございます。

お教え頂きました方法で、あるシンボルをマウスオーバーしたら別のフレームに飛んで、そこに設定してあるシンボルを拡大表示するようなことは可能でしょうか？。

・レイヤー１のフレーム１にＸ１と言うムービーシンボルを配置し、そのシンボルにScriptを記述する。（教えていただいたものを「this」を「XXX」と言うインスタンス名に変更）

・レイヤーBのフレーム5にＸ２と言うムービーシンボルを配置する。

・フレーム1,5には「STOP() ;」と言うScriptを記述する。

こうしても全く反応しません。

回答No.1

GETSTREET

こんな感じでしょうか？

onClipEvent (load) {
this._yscale = 100;
this._xscale = 100;
}
on (rollOver) {
this._yscale = 200;
this._xscale = 200;
}
on (rollOut) {
this._yscale = 100;
this._xscale = 100;
}

お礼

早速ありがとうございます。
初歩的な稚拙な質問で恐縮ですが、教えて下さい。

・何故「onClipEvent」って必要なんでしょうか？。
　単にムービーにScriptを記述するだけで実行してくれないのでしょうか？。今までこのようなイベントを使ったことはありません。

・必ず最初の大きさを記述する必要はありますか？。

・拡大されるときの起点は変更出来ますか？。
　それとも基になるシンボルに依存するのでしょうか？。

・「loadVariables」でダイナミックテキストの変数に外部のテキストを読み込み、ダイナミックテキストをムービーシンボルに変換し、上記のようにマウスオーバー時に拡大表示することは可能でしょうか？。

どうぞ宜しく御願い致します。