- Home /
How can I maintain webplayer aspect ratio on a web page using CSS
I have browsed the CSS forums but nothing that they suggest for maintaining aspect ratios of images and divs seem to work? I want the player to scale fluidly if the user scales the browser window.
Has anyone ever done this? I find it difficult to believe nobody has ever tried using the webplayer on a fluid webpage layout.
Note: My game GUI code works fine, its the proportions of the overall Unity window that I want to maintain. (ie even if the window contained nothing it should still be 4:3)
In my javascript file I have tried using:
unityObject.embedUnity("unityPlayer", "http://myGame.unity3d", "100%", "100%",params);
but proportions are lost. And if I do a fixed pixel size then obviously the Unity window wont scale to fir the browser window.
Answer by tomekkie2 · Jun 07, 2012 at 02:13 PM
Most common flexible layout is the full browser layout and that is easy and there are plenty of examples for that in the web. In your case you can setup the special javascript functions:
body onload:
- calculate the browser window size, set the css dimensions, embedUnity with "100%", "100%" in the containing div tags
window.onresize:
recalculate the browser window size, set new css dimensions for the div tags containing the WebPlayer - in case of resize event
Go to see this working: http://virtualplayground.d2.pl/WP/?p=367
Your answer
Follow this Question
Related Questions
Scale WebGL cavas to browser window size 0 Answers
Webplayer interaction between 3d scene and text on webpage 1 Answer
webplayer resolution problems/issues/oddities and frame rate weirdness 6 Answers
Webplayer - How to preserve aspect ratio in full screen? 1 Answer
How to format Unity's Webplayer 1 Answer