2012-06-05 165 views
2

我试图让浏览器调整大小时调整Unity WebPlayer控件的大小。这是我认为的代码是中肯:在调整浏览器大小时调整Unity WebPlayer元素的大小

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
    <head> 
     <script type="text/javascript"> 
     <!-- 
     function GetUnity() 
     { 
      if (typeof unityObject != "undefined") 
      { 
       return unityObject.getObjectById("unityPlayer"); 
      } 
      return null; 
     } 

     function ResizeUnity() 
     { 
      //This function properly assigns innerWidth and Height to winWidth and winHeight 
      GetWindowSize(); 

      var unity = GetUnity(); 
      if(unity != null) 
      { 
       //This does not properly resize anything at all 
       unity.width = winWidth; 
       unity.height = winHeight; 
      } 
     } 
    } 

    if (typeof unityObject != "undefined") 
    { 
     GetWindowSize(); 
     //This replaces the unityPlayer div below with an actual WebPlayer object 
     unityObject.embedUnity("unityPlayer", "WebPlayer.unity3d", winWidth, winHeight, params);    
    } 
    --> 
    </script> 
    <style type="text/css"> 
    <!-- 
    div#unityPlayer { 
     cursor: default; 
     height: 100%; 
     width: 100%; 
    } 
    --> 
    </style> 
    </head> 
    <body margin="0" marginwidth="0" marginheight="0" scroll="no" onResize="ResizeUnity()"> 
     <div class="content"> 
      <div id="unityPlayer"> 
       <div class="missing"> 
        <a href="http://unity3d.com/webplayer/" title="Unity Web Player. Install now!"> 
        </a> 
       </div> 
      </div> 
     </div> 
    </body> 
</html> 

从各种alert() S IN的代码,我可以确认的是,当我改变窗口的大小ResizeUnity()被调用。我可以验证winWidthwinHeight正在调整大小后为其分配适当的值。但是,无论我对浏览器窗口做什么,Unity WebPlayer对象都保持与加载时相同的大小。

我在做什么错?

回答

2

看来GetUnity()函数并没有抓取一个足够高的元素到它的div层次结构中,以便我调整正确的元素大小。更新我ResizeUnity()函数这并获得成功:

function ResizeUnity() 
{ 
    //This function properly assigns innerWidth and Height to winWidth and winHeight 
    GetWindowSize(); 

    var unity = document.getElementById('unityPlayer'); 
    if(unity != null) 
     {     
      unity.style.width = winWidth + "px"; 
      unity.style.height = winHeight + "px"; 
     } 
} 
0

您需要调整包含您的游戏div的属性。 大部分时间CSS足以做到这一点,你不需要JavaScript。

这里是一个工作的例子,使用浏览器的全宽度和高度显示游戏:

<html xmlns="http://www.w3.org/1999/xhtml"> 
    <head> 
     <script type="text/javascript" src="http://code.jquery.com/jquery-2.0.3.min.js"></script> 
     <script type="text/javascript" src="http://webplayer.unity3d.com/download_webplayer-3.x/3.0/uo/UnityObject2.js"></script> 
     <script type="text/javascript"> 
      var u = new UnityObject2(); 
      jQuery(function() { 
       u.initPlugin(jQuery("#unityPlayer")[0], "http://unity3d.com/files/live-demos/angrybots/AngryBots.unity3d"); 
      }); 
     </script> 
     <style type="text/css"> 
     html, body { 
      height: 100%; 
      margin: 0; 
     } 
     #unityPlayer { 
      position:fixed; 
      top:0px; 
      left:0px; 
      height: 100%; 
      width: 100%; 
     } 
     </style> 
    </head> 
    <body> 
     <p>Some text that will be hidden...</p> 
     <div id="unityPlayer"></div> 
     <p>Some more text that will also be hidden.</p> 
    </body> 
</html> 
相关问题