U3 - How to fill entire browser window?

Unity Engine
1

The “trick” that used to work with Unity 2.x web players doesn’t work with the new U3 html template. Anyone know how to get the webplayer to fill the entire browser window?

2

-bump-

3

don’t know why that should not work as thats a webpage thing described there, nothing that even touches unity.

what does not work? aside of the known problem that the webplayer sometimes becoems a single line on some more hefty resizes and aspect ratio changes?

4

The Unity 2.6 method was to change the height and width dimensions to “100%” (they are by default set to a pixel measurement). By doing the same thing in the 3.1 html template only the width changes, the height remains the same. I’m not very experienced with html / css so I may be missing something, but I haven’t found anything in the template that looks like it could be altered to make the player fill the webpage.

5

First step definitely would be to download the JS file thats used since 3.1, replace the sections offending with your intend and then use that local one instead of the UT hosted one.
If thats already the case there shouldn’t be anything preventing you from using 100%, as long as you set the 100% in CSS, using HTML tags is something that might not be all that smart in HTML5 - CSS3 days anymore as they were declared deprecated half a decade ago when CSS1 was introduced (yet still too many rely on them working)

6

I’m not very experienced with html / css…

What I might do is to take the 2.6 template and then modify it to work with 3.1 but I wanted to ask to see if someone else has fixed this first before trying that.

7

Here you go.

8

Perhaps I’m missing something but I don’t think that thread really applies unfortunately. I want the webplayer to fill the browser window, not the video screen.

Here’s my edited html script. For the life of me I can’t see what I’m doing wrong:

<!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>Unity Web Player | ShadowTestU3</title>
		<script type="text/javascript" src="http://webplayer.unity3d.com/download_webplayer-3.x/3.0/uo/UnityObject.js"></script>
		<script type="text/javascript">
		<!--
		function GetUnity() {
			if (typeof unityObject != "undefined") {
				return unityObject.getObjectById("unityPlayer");
			}
			return null;
		}
		if (typeof unityObject != "undefined") {
			unityObject.embedUnity("unityPlayer", "ShadowTestU3.unity3d", "100%", "100%");
		}
		-->
		</script>
		<style type="text/css">
		<!--
		body {
			font-family: Helvetica, Verdana, Arial, sans-serif;
			background-color: white;
			color: black;
			text-align: center;
			margin: 0;
			padding: 0;
			height:	100%;
		}
		a:link, a:visited {
			color: #000;
		}
		a:active, a:hover {
			color: #666;
		}
		p.header {
			font-size: small;
		}
		p.header span {
			font-weight: bold;
		}
		p.footer {
			font-size: x-small;
		}
		div.content {
			padding: 0px;
			margin: 0px;
			height: 100%;
			width: 100%;
		}
		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 {
			margin: 0px;
			padding: 0px;
			cursor: default;
			height: 100%;
			width: 100%;
		}
		-->
		</style>
	</head>
	<body>
		<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>
		</div>
	</body>
</html>
9

Interestingly enough, I just tested the above html in Safari and it worked. But it doesn’t in FireFox. Anyone have any ideas?

10

Do you have firebug installed? it has a tendency to interfer and make trouble due to its incorrect interpretation of whats right or wrong.
Also FF 3.5 / 3.6 unhappily have some bugs on interpreting stuff by doing W3C level enforcement against common practices (for example at which point in the hierarchy javascript code is correct etc and where not).

Ensure to have no dublicates and JS code that complies to W3C requirements

11

Nope, no firebug here. I turned off all the extensions I had installed. I’m running FireFox 3.6.8 under OS X 10.6.5. I’ll give it a test on my Windows machine in the morning.

12

Tested the same script with both Firefox and IE under Windows and they both don’t do full height. But both do work with the U2.6 template. Anyone know what my script is missing?