- 締切済み
AS3でページ移動時の表示動作に関する質問です
いつもお世話になります。 現在フルFLASHにてサイト制作中です。 以下サイトの様に、背景画像は別ページへ飛ぶと、現在いるページの コンテンツが移動して、新たなコンテンツが表示されるような仕組みを 作りたいと考えていますが、これはActionScript3(以下AS3)で行なう場合、 どのような処理を行えば良いのでしょうか? 以下サイトの例ですと、上部メニューの「item」から「concept」に移動すると、 表示してたitemのコンテンツが下に移動しながら、conceptのコンテンツが表示される仕組みです。 http://www.freestitch.jp/ ページ移動した際、一旦コンテンツが消えて(真っ白になる等)、 新しいコンテンツが表示される仕組みであれば何となくわかりますが、 現在いるページのコンテンツとクリック先のコンテンツを同じ表示上で クロスオーバーさせる手段がわかりません。 何方かご教授いただけると幸いです。 宜しくお願いいたします。
- みんなの回答 (1)
- 専門家の回答
みんなの回答
- BlurFiltan
- ベストアンサー率91% (1611/1754)
なんだか妙な捉え方と言いますか, 複雑に考えすぎと言いますか, 「コンテンツの移動」という変なフィルタをわざわざ通して見るから 理解できないのではないかと思います。 変なフィルタをかけた目で見るのではなくて,極々普通に見れば, ムービークリップを右往左往させたり,表示/非表示を切り替えているだけにしか見えませんよ...。 たとえば...。 ステージ上の上の方に 「btn0」,「btn1」,「btn2」 という インスタンス名 を付けたボタンインスタンスを用意します。 また ステージ上の適当な位置に 「mc0」,「mc1」,「mc2」 という インスタンス名 を付けたムービークリップを用意します。 ※参考:【図】↓ それらインスタンスを配置したレイヤーとは別のレイヤーを追加で用意して, 例えば次のように書けば,勝手なサンプルの出来上がりです。 ------------------------------------ // ムービークリップを動かす速さを指定 var spd:Number=3/10; // 変数 y0 の定義(初期設定) var y0:Number=100; // 変数 x2 の定義(初期設定) var x2:Number=stage.stageWidth+100; // mc1 を非表示にする mc1.visible=false; // mc2 の x座標 を x2 にする mc2.x=x2; // mc0 に毎フレーム実行するイベントリスナーを登録 mc0.addEventListener(Event.ENTER_FRAME,funcMC0); // 関数 funcMC0 の定義 function funcMC0(evt:Event):void { // mc0 の y座標を y0 に spd の割合ずつ近付ける evt.target.y += (y0-evt.target.y)*spd; } // mc2 に毎フレーム実行するイベントリスナーを登録 mc2.addEventListener(Event.ENTER_FRAME,funcMC2); // 関数 funcMC2 の定義 function funcMC2(evt:Event):void { // mc2 の x座標を x2 に spd の割合ずつ近付ける evt.target.x += (x2-evt.target.x)*spd; } // btn0 に クリックしたとき実行するイベントリスナーを登録 btn0.addEventListener(MouseEvent.CLICK,funcBTN0); // 関数 funcBTN0 の定義 function funcBTN0(evt:Event):void { // 変数 y0 を 100 にする y0=100; // mc1 を 非表示 にする mc1.visible=false; // 変数 x2 を stage.stageWidth+100 にする x2=stage.stageWidth+100; } // btn1 に クリックしたとき実行するイベントリスナーを登録 btn1.addEventListener(MouseEvent.CLICK,funcBTN1); // 関数 funcBTN1 の定義 function funcBTN1(evt:Event):void { // 変数 y0 を stage.stageHeight - 60 にする y0=stage.stageHeight-60; // mc1 を 表示 する mc1.visible=true; // 変数 x2 を stage.stageWidth-50 にする x2=stage.stageWidth-50; } // btn2 に クリックしたとき実行するイベントリスナーを登録 btn2.addEventListener(MouseEvent.CLICK,funcBTN2); // 関数 funcBTN1 の定義 function funcBTN2(evt:Event):void { // 変数 y0 を stage.stageHeight + 100 にする y0=stage.stageHeight+100; // mc1 を 非表示 にする mc1.visible=false; // 変数 x2 を stage.stageWidth/2 にする x2=stage.stageWidth/2; } ------------------------------------ ↑すごく適当です。 こんな感じで各ボタンをクリックしたときに 各ムービークリップをどこに置きたいのかをイメージして, イメージ通りの場所に配置させるように動かせば良いと思います。
お礼
ご回答ありがとう御座います。 各フレームに動きをつけて、ページが変わる度に該当するフレーム番号に 飛ばすような仕組みを考えていたので、ご指摘のように、 アニメーションもASで記述するような仕組み動きを考えたいと思います。 上記の書式では別ページに移動した場合、MCを非表示(visible=false;)のように 処理していますが、MCのフェードイン(アウト)処理もAS上で可能でしょうか? もし可能であればその処理方法を教えていただけると幸いです。 宜しくお願いいたします。