2012-04-14 11 views
8

Ich bin neu in all dem und kann nicht herausfinden, wie ich den Flash-Player, den ich für meinen Heim-Medienserver verwende, skaliere, wenn das Fenster verkleinert oder die Ausrichtung geändert wird. Ich basiere die Playergröße auf der Größe des Ansichtsfensters. Ich habe verschiedene Versionen gesucht und ausprobiert, aber sie funktionieren nicht, was wahrscheinlich auf meinen Mangel an Wissen zurückzuführen ist. Der meiste Code unten wurde bereits gemacht, ich habe kommentiert, was ich hier als Referenz hinzugefügt habe.Ansichtsfenster-Größenänderungsereignis für Flash-Player

Link to a sample

viewport.js (von mir hinzugefügt)

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

ich Tage jetzt damit verbracht habe nach einer Lösung für dieses Problem suchen. Leider gibt es keine Möglichkeit, dies ständig auf dem Handy zu tun, siehe: http://quirksmode.org/dom/events/resize_mobile.html –

Antwort

20

zum window Objekt binden einfach auf die resize und orientationChange Veranstaltungen und Nutzung th e JW Playerresize Methode nach dem Erlangen der neuen Breite und Höhe.

So etwas wie das.

$(window).on('resize orientationChange', function(event) { 
    var width = $(window).width(); 
    var height = $(window).height(); 
    jwplayer('player').resize(width, height); 
}); 
+0

Ich weiß nicht, wie das geht. Wie ich schon sagte, ich bin ein kompletter NuB zu diesem Thema. Ich bin mir nicht einmal sicher, wohin es gehen würde. (js oder html) – user1333680

1

die DOM-API Ansichtsfenster Resize zu erkennen:

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