koobas.hobune.stream
Web Player Window height size is too small...
Hi,
I build to Web Player, resolution is 600x450. 
And I want like tiger woods pga tour online style. It's pop-up window, available to resize and doesn't resizing under specific size(min size). So, I change html code like below.
unityObject.embedUnity("unityPlayer", "WebPlayer.unity3d", "100%", "100%");
but, result is like below picture... 
Width is right, height is wrong... And resizing is not working. What's wrong with this?
I modify html code,
<!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 | WebPlayer</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", "WebPlayer.unity3d", "100%", "100%");
}
-->
</script>
<style type="text/css">
<!--
body {
font-family: Helvetica, Verdana, Arial, sans-serif;
background-color: white;
color: black;
text-align: center;
}
a:link, a:visited {
color: #000;
}
a:active, a:hover {
color: #666;
}
div.content {
margin: auto;
width: 100%;
height: 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 {
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>
So, resizing is working! And it work perfect in 'google chrome', 'safari', resolution is right. But, it still not work in 'IE8', 'IE9', 'firefox'. I wanna do it in 'IE'.
IE is slightly different. I have the code on another machine. Unless someone beats me to it, will post in about 12 hours
Set margin and border to zero for "content" and "missing".
Thanks to answering. I Set 'margin' and 'border' to zero for "content" and "missing". But, it's still wrong height in 'IE', 'Firefox'.
yes, it's still wrong height in 'IE8', 'Firefox'.
why?
thanks!
Try adding height="100%" to the html element in your css.
That solved the same issue for me in Firefox and IE.
<style>
html {
padding: 0px;
margin: 0px;
height: 100%;
}
</style>
