2012-04-14 8 views
8

私はこれを初めてお持ちですが、ウィンドウのサイズを変更したり、向きが変わったりすると、私のホームメディアサーバーに使用するフラッシュプレーヤーのサイズを変更する方法がわかりません。私は、ビューポートのサイズに基づいてプレーヤーのサイズを決めています。私はさまざまなバージョンを検索して試しましたが、私の知識が不足している可能性が高いため動作しません。 以下のコードのほとんどは既に行われていますが、ここで参考にしたコメントはコメントしました。flashportのビューポートのサイズ変更イベント

Link to a sample

viewport.js(私が追加)

var width = $(window).width(); 
var height = $(window).height(); 

HTML

<html xmlns="http://www.w3.org/1999/xhtml"> 

<head> 
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1" /> 
<title>Gizmo play_flash</title> 
<meta name="keywords" content="" /> 
<meta name="description" content="" /> 
<meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0; user-scalable=0;" /> 
<script type="text/javascript" src="scripts/jwplayer.js"></script> 
<script type="text/javascript" src="jquery/jquery.js"></script> 
<script type="text/javascript" src="scripts/viewport.js"></script> 
<noscript><meta http-equiv="refresh" content="2; URL=noscript.html"></noscript> 
</head> 

<body style="margin: 0; padding: 0; background-color: #000000"> 
<div id="outer"> 

    <div class="player_wrapper" style="width: 100%; height: 100%; margin:0px auto;"> 
     <div id="player"> 
      Loading the video player ... 
     </div> 
    </div> 

    <script type="text/javascript"> 
     jwplayer('player').setup({ 
      'flashplayer': 'scripts/player.swf', 
      'file': '[File.FlashLink]', 
      'autostart': 'true', 
      'duration': '[File.Duration]', 
      'provider': 'scripts/jrmediaprovider.swf', 
      'skin': 'scripts/glow.zip', 
        <!--begin mod--> 
      'width': width - 5, 
      'height': height - 5 
        <!--endmod--> 
     }); 

     jwplayer('player').onComplete(
      function(event) { 
       try { 
        window.Gizmo.onComplete(); 
       } catch (err) { } 
      } 
     ); 
    </script> 
</div> 
</body> 
</html> 
+1

私は今、この問題への解決策を探して日々を過ごしてきました。残念ながら、これは一貫してモバイル上で行う方法はありません。http://quirksmode.org/dom/events/resize_mobile.html –

答えて

20

だけresizeorientationChangeイベントや使用上のwindowオブジェクトにバインドth新しい幅と高さを取得した後のe JW Playerresizeメソッド。

このようなものです。

ビューポートのサイズ変更を検出するために、DOM APIを使用し
$(window).on('resize orientationChange', function(event) { 
    var width = $(window).width(); 
    var height = $(window).height(); 
    jwplayer('player').resize(width, height); 
}); 
+0

これを行う方法はわかりません。私が言ったように、私はこれに完全なNuBです。私はそれがどこに行くか分からない。 (jsまたはhtml) – user1333680

1

window.addEventListener('resize', (ev) => { 
    console.log(window.innerWidth, window.innerHeight); 
});