Scaling hype to browser window width


(Bas) #1

Hi all,
I have been implementing this ( http://hype.desk.com/customer/portal/articles/259191-responsive-size-for-your-project-resizing-your-document-to-fit-in-a-window-or-element ) in my animation and it works great offline, but as soon as I upload the Hype content something breaks… In some cases the “scalecontainer” div is completely gone or just ignored, this seems to depend on which browser.

The normal hype export works fine, but the adjusted .html file stops working. Does anyone has a clue how to fix this. Looking forward to your suggestions!

Here is the link to the scaling document: http://baskools.com/locoles/heteitjevanbreda/Interface_01_scaling.html (and now using this link it seems to work, but when I copy the link and past it in an other tab it stops working again, this is weird)
Here is the link to the regular hype export document: http://baskools.com/locoles/heteitjevanbreda/Interface_01.html


(Greg) #2

I’m not sure if it will help, but you have a div wrapped around the doc’s body…

  </head>  <div id = "scalecontainer">

  <body>

  (...)

  </body> </div>

Have you tried putting that div inside of the body?


(Bas) #3

Hi Greg,
Yes that was one one of the test I did, I have since move the div back inside the body.
Thanks for looking at it though… Im just looking for anyone with suggestions really.


(Ken Heins) #4

Worked for me in Safari, Firefox and Google Chrome, I pasted it into all 3, am I missing something in your question?

will fire up Parallels and try it in Internet Explorer.


(Ken Heins) #5

Update: worked in Windows 7 Internet Explorer.
Did not work in Windows 10 technical preview/Internet Explorer 11, but I am not sure what to expect of it. Checked one of my sites on Windows 10, looks great but botches fonts,


#6

I recommend trying this method @stephen put together: Proportionally scaling a Tumult Hype document based on the browser width


(Bas) #7

Works great, thanks! you can see a working example here