HTML Question, making web player fill out web browser window?

Question

<head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>Unity Web Player | ShuLei</title> <script type='text/javascript' src='https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js'></script> <script type="text/javascript">  </script> <script type="text/javascript">  </script> <style type="text/css">  </style> </head> <body> <p class="header"><span>Unity Web Player | </span>ShuLei</p> <div class="content"> <div id="unityPlayer"> <div class="missing"> <a href="http://unity3d.com/webplayer/" title="Unity Web Player. Install now!"> <img alt="Unity Web Player. Install now!" src="http://webplayer.unity3d.com/installation/getunity.png" width="193" height="63" /> </a> </div> <div class="broken"> <a href="http://unity3d.com/webplayer/" title="Unity Web Player. Install now! Restart your browser after install."> <img alt="Unity Web Player. Install now! Restart your browser after install." src="http://webplayer.unity3d.com/installation/getunityrestart.png" width="193" height="63" /> </a> </div> </div> </div> <p class="footer">« created with <a href="http://unity3d.com/unity/" title="Go to unity3d.com">Unity</a> »</p> </body> I dont know any HTML, I searched about it and found a script taht worked, but when it comes to networking, the auto generated one with unity only works. What do I put in this HTML code, to make it fill the whole browser window? Where do I put '100%'? (read about it)

Answer 1

Answer by MFen · Dec 16, 2013 at 09:18 PM

Using the default format that unity provides for you, edit with notepad++ (or anything else but the lines may be different)

Line 15/16 says something to the effect of

if (typeof unityObject != "undefined") { unityObject.embedUnity("unityPlayer", "WebPlayer.jpg", 1286, 804);

Change the 1286 to 100% and 804 to 100%

Add comment · Show 1 · Share

Madswint · Dec 16, 2013 at 09:33 PM 0

Share

The one I posted, is what Unity provides me with notepad++, if I change the width: 960, height: 600, at line 17, to 100% both of them, and puts it on my website, it just keep telling me to download unity web player.

http://shuleii.dk/CharacterTest/CharacterTest.html

Answer 2

Figured it out, here's the code to anyone in same problem (change the CharacterTest.unity3d to your file eg. Test.unity3d

 <!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>
         <title>Name</title>
         <meta charset="iso-8859-2">
         
         <script type='text/javascript' src='https://ssl-webplayer.unity3d.com/download_webplayer-3.x/3.0/uo/jquery.min.js'></script>
         <script type="text/javascript">
         <!--
         var unityObjectUrl = "http://webplayer.unity3d.com/download_webplayer-3.x/3.0/uo/UnityObject2.js";
         if (document.location.protocol == 'https:')
             unityObjectUrl = unityObjectUrl.replace("http://", "https://ssl-");
         document.write('<script type="text\/javascript" src="' + unityObjectUrl + '"><\/script>');
         -->
         </script>
         <script type="text/javascript">
         <!--
             var config = {
                 width: "100%", 
                 height: "100%",
                 params: { enableDebugging:"0" }
                 
             };
             config.params["disableContextMenu"] = true;
             var u = new UnityObject2(config);
             
             jQuery(function() {
 
                 var $missingScreen = jQuery("#unityPlayer").find(".missing");
                 var $brokenScreen = jQuery("#unityPlayer").find(".broken");
                 $missingScreen.hide();
                 $brokenScreen.hide();
 
                 u.observeProgress(function (progress) {
                     switch(progress.pluginStatus) {
                         case "broken":
                             $brokenScreen.find("a").click(function (e) {
                                 e.stopPropagation();
                                 e.preventDefault();
                                 u.installPlugin();
                                 return false;
                             });
                             $brokenScreen.show();
                         break;
                         case "missing":
                             $missingScreen.find("a").click(function (e) {
                                 e.stopPropagation();
                                 e.preventDefault();
                                 u.installPlugin();
                                 return false;
                             });
                             $missingScreen.show();
                         break;
                         case "installed":
                             $missingScreen.remove();
                         break;
                         case "first":
                         break;
                     }
                 });
                 u.initPlugin(jQuery("#unityPlayer")[0], "CharacterTest.unity3d");
             });
             
             detectLang();
         
             function detectLang() {
                 var actualLang = (navigator.language) ? navigator.language : navigator.userLanguage;
                 if(actualLang=="pl"){
                     document.title = "Pe³ne okno przegl±darki";
                 }
             }
             
         -->
         </script>
     <style type="text/css">
         <!--
     /* hide from ie on mac \*/
         html {
         height:100%;
         margin: 0px;
         padding: 0px;
         overflow: hidden;
         }
             /* end hide */
         body {
         height:100%;
         font-family: Helvetica, Verdana, Arial, sans-serif;
             background-color: #cccccc;
             color: #808080;
         text-align: center;
         font-size: medium;
         border:0;
         padding: 0;
         margin: 0;
         overflow:hidden;
         }
         
         a:link, a:visited {
             color: #000;
         }
         a:active, a:hover {
             color: #666;
         }
         
         div#content {
         width: 100%;
         height: 100%;
         border:0;
         padding: 0;
         margin: 0;
         overflow:hidden;
         }
 
         div.missing {
             margin: auto;
             position: relative;
             top: 50%;
             width: 193px;
         }
         div.missing a {
             height: 63px;
             position: relative;
             top: -31px;
         }
         div.missing img {
             border-width: 0px;
         }
         div#unityPlayer {
             cursor: default;
             width: 100%;
             height: 100%;
         }
         
 -->
         </style>
 </head>
 <body>
     <div id="content">
         <div id="unityPlayer">
             <div class="missing">
                 <a href="http://unity3d.com/webplayer/" title="Unity Web Player. Install now!">
                     <img alt="Unity Web Player. Install now!" src="http://webplayer.unity3d.com/installation/getunity.png" width="193" height="63" />
                 </a>
             </div>
         </div>
     </div>
 </body>
 </html>

HTML Question, making web player fill out web browser window?

2 Replies

Your answer

Follow this Question

Related Questions