
サイトをリニューアルしました。
サイト背景全面に動画をのっけるというものをしたくて、構想はあったのですがなかなかよい動画素材がなく、背景を静止画で済ませてたのですが、今回使えそうな素材も準備でき念願の全画面動画サイトにできました。
背景が動画に変わった以外は、特に変更ありませんが、見た目のインパクトはかなりのものがあると思います。
今回のリニューアルで少しつまづいたところは、
「画面サイズを変更したとき、各パーツのサイズはそのままで、動画のみをリサイズする」
ということでした。
stage.scaleMode = StageScaleMode.NO_BORDER
でいけそうとか思ってたんですが、これだとパーツもなにもかも拡大縮小されちゃうので使えない。動画のみをStageScaleMode.NO_BORDERの効果のようにしなきゃいけないので、
動画をムービークリップにし、インスタンス名にmcMovieと付け、
//ステージは拡大縮小なし
stage.scaleMode = StageScaleMode.NO_SCALE
//動画背景の処理 // 変数 mcMovie_ratio に mcMovie の 縦/横 の比を算出 var mcMovie_ratio = _root.mcMovie._height/_root.mcMovie._width; // mcMovieSettingの定義 function mcMovieSetting() { // mcMovie の座標を指定 _root.mcMovie._x = Stage.width/2; _root.mcMovie._y = Stage.height/2; // --- mcMovie の大きさに関するスクリプト --- // --- 比率を変えずに拡大・縮小・トリミングをする --- // もしステージの形が mcMovie の形より縦長であれば if (Stage.height/Stage.width>=mcMovie_ratio) { // mcMovie の大きさをステージの幅との比で決定 _root.mcMovie._width = Stage.height/mcMovie_ratio; _root.mcMovie._height = Stage.height; // もしステージの形が mcMovie の形より横長であれば } else { // mcMovie の大きさをステージの高さとの比で決定 _root.mcMovie._width = Stage.width; _root.mcMovie._height = Stage.width*mcMovie_ratio; } }
としたところ、なんとか希望通りの動作してくれました。(ActionScript2.0です。)
動画自体のサイズは848*480pixelで作ってあります。
動画にドットを被せているのですが、こちらは自分のASの技量がなく、試行錯誤するも上手くいかなかったので、結局は大きなPNG画像を上に被せているだけです。
あとは、ドット被せをASでやりたいのと、このサイトをProgressionで作り直したいこと。
頑張らねば。
- Newer: 新作映像上映イベント「FRENZ」
- Older: 世界の果てまでイッテQ!
Comments:2
- 匿名 09-04-22 (水) 19:50
-
こんにちわー
ActionScript2.0だと、
ウィンドウサイズにいっぱいはこんなやり方がありました。
http://ameblo.jp/versatran/entry-10241919133.html
もちろん動画でもできます
ドット被せはこちらいじくってできましたよ〜。
http://blog.studio-placebo.com/?p=62 - kawacho 09-04-25 (土) 16:51
-
ありがとうございます!
参考にしてみます~。
Trackbacks:0
- Trackback URL for this entry
- http://blog.orangeage.net/archives/57/trackback
- Listed below are links to weblogs that reference
- 全画面動画背景なサイトにリニューアル from ORANGE AGE Weblog



