2008年03月28日

CSSによるフィルターのトラブル

クリックすると拡大表示します。ただし、実際の1/2のサイズです。 過日、ライブをBS2で放送したことを知り合いの方から知らされたのですが、昨日gyaoで、玉置浩二のPVを5本ほど集めてあったのを発見し、試しにDVDに保存してみることにしました。ファイルの種類はwmvファイルです。
 少し暗い感じの画像(演奏の仕方が暗いのではなく、画像そのもの)が揃っていたので、背景も黒に、そしてWindowsMediaPlayerのコントロールパネルが浮き出さないようにCSSで黒っぽくしてみました。
 さらに、5曲を選びやすいようにフレームを使ってメインフレームとメニュー用フレームに分けてみました。ここまでは良かったのですが、動作の確認をするとIEがハングアップしました。



tamaki_3.gif


実は、フレームを使ってwmvファイルを再生させるというファイル群は、先月、コブクロのwmvファイルをYahoo!動画を使って作っていたのですが、当然何のトラブルもなかったのでそのときのファイルを利用しました。
 動画のファイルの提供元が、Yahooとgyaoの違いはありますが、同じwmvファイルで、トラブルの原因がそこにあるとは思えません。

 順にいろいろと試してみて、原因がWindowsMediaPlayerのコントロールパネルにあることが分かりました。
 コントロールパネルを黒っぽくするには、
2008年03月15日のwmplayerの背景色指定のテストの記述を利用して、embedタグの中に、
style="FILTER: xray alpha(opacity=50,style=2,finishopacity=50); WIDTH: 640px; HEIGHT: 525px"
という記述を入れていたのですが、これをなくすと円滑に動作しますから、これが原因だと分かりました。
単純に
style="FILTER: xray()"
としてもトラブルは再発しました。

ただし、上の図のように単独で開く時には問題ないのですが、フレームを使って、メインフレーム内でwmvファイルを再生させている状態から、メニューで他のHTMLファイル(wmvファイルの再生用)を同じフレームで再生させようとするとハングアップするのです。さらにフレームなしのブラウザで再生中に、エクスプローラからドラッグ&ドロップで他のHTMLファイルを再生させてもハングアップしました。

クリックすると拡大します。ただし、実際の半分の縮尺です。
 結局、フレームを使ったメニュー付きの再生の場合は、左の図のように
style="FILTER: xray()"
を用いないことにしました。ただ、黒の背景に黒っぽいコントロールパネルもなかなか良いと思うので、target="_blank"を使って、上の図のように単独のブラウザで開けるようにしました。

 環境を書いてもいいのですが、きりがないので記述は省略します。ただ、WMPとstyle="FILTER: xray()"の組合せでトラブルが起きる可能性がある、ということだけここに記録しておくことにします。

玉置浩二 −Sellection−

Track01 「プレゼント」
→ 動画URL=rtsp://wms.cd.gyao.jp/gyaovod01?QueryString=rpc_sequence=982298000:rpc_mode=p2j: 
Track02 「惑星」
→ 動画ULR=rtsp://wms.cd.gyao.jp/gyaovod01?QueryString=rpc_sequence=982405745:rpc_mode=p2j:
Track03 「愛されたいだけさ」
→ 動画ULR=rtsp://wms.cd.gyao.jp/gyaovod01?QueryString=rpc_sequence=982414745:rpc_mode=p2j:
Track05 「Lion」
→ 動画URL=rtsp://wms.cd.gyao.jp/gyaovod01?QueryString=rpc_sequence=982419795:rpc_mode=p2j:

1 動画URL=の横の"rtsp://"から"rpc_mode=p2j:"までをコピー(右クリックして「ショートカットのコピー」を選びます。)してから、
WindowsMediaPlayer(WMP)をまず開き、WMPのメニューの中で、ファイル→URLを開くを選んでペーストすることで再生できました。
(ショートカットは Ctrl+U、そしてCtrl+V)
2 前後に短いCMが入ります。
3 公開は、2008年4/27(日)正午までとのことです。

posted by kewpie at 20:28| Comment(0) | TrackBack(0) | ファイル作成
この記事へのコメント
コメントを書く
お名前: [必須入力]

メールアドレス:

ホームページアドレス:

コメント: [必須入力]

認証コード: [必須入力]


※画像の中の文字を半角で入力してください。
この記事へのトラックバックURL
http://blog.sakura.ne.jp/tb/13259667
※ブログオーナーが承認したトラックバックのみ表示されます。
※言及リンクのないトラックバックは受信されません。

この記事へのトラックバック
コメントの投稿について
○お名前とコメント欄の記入は必須です。
○メールアドレスは任意です。記入されても公開はされません。管理人のみに知らされます。
○スパム防止のため、
・ホームページアドレス欄への記入はできません。
・コメント欄にURLは記入できません。
・スパムと思われる語を記入できません。
 これらをしようとすると、最終的に投稿完了できません。
○投稿完了後に、管理人の判断でスパムと判断した投稿は削除させていただきます。