I’m trying to create a static webpage in Hype. I generated the whole layout and checked the preview to see, a big chunk of my content in the bottom isn’t showing on the page. I’m attaching my hype document. So, if someone can tell me what is the thing that I’m doing wrong, it’ll be of great help.
Broken Hearts.hype.zip (65.5 KB)
Setting ‘Expand to fill’ for the group will ensure that the Group (the one that contains all your content) grows so that it always fills 100% of the width – this will cut off the bottom since your document is much taller than it is wide. If you instead use ‘Shrink to fit’, both the height and width of the group will be considered, so neither dimension will get cut off.
Yeah, that did solve that problem. But, I need expand to fill so that the content stretches according to browser width (since I’m trying to make it like a webpage, I need it to be available at all screen sizes, i.e. even at 1920 and beyond and I can’t keeping making layouts for all available resolutions). That’s how it looks with shrink to fit option on (image attached). You can see, the content is now towards the left (as opposed to scaling with browser width in my previous file). Can I somehow get both?
i'd guess this'll help (set the scene to flexible height please):
Broken Hearts.hype.zip (75.2 KB)
That’s just awesome, sir. Thanks a lot!!
Sorry to re-open this, but, today, I created another scene. That scene has a significantly larger height that the one you can see above. So, when a user goes to the new scene, the height of the browser doesn’t change until it’s resized at least once. As from what I understood from the code, it sets height only in the beginning when the first scene loads. Thus, even when the scene changes, it doesn’t update the height until the browser is resized and it is triggered to match the height of the new content. It stays in the height of the old content and thus, my content gets clipped again.
I tried to use another function (window.location.reload();) when the new scene kicks in and without doubt, that didn’t work because it refreshes the browser tab and I’m back on the first scene.
I think, this can be solved if I can somehow use another function to get triggered when the scenes load. This function should set the javascript you sent yesterday in the <head> of my document, so, the height will change when each scene loads. I’m just not sure how to do this.
How can I do that, or is there any other solution?
your second scene has checked the flexible height?
if not … could you attach the document?
Yes, the flexible height option is checked.
I’m assuming you mean that if it’s checked, then I need to send the document?
Broken Hearts.hype.zip (1.9 MB)
it seems onsceneload occurs sometimes after layout request so
the new height may get overwritten 
try:
Broken Hearts.hype.zip (1.9 MB)
I’m not sure what exactly you have done. Can you please mention it? By the way, you fixed the issue again. Now, I hope, just duplicating the scenes and changing the body content will work for the height, right?
i also added setting the doc-height onsceneload …
Oh, yeah! Thanks a lot sir!
Hype is a great app backed up by a great community.
Hi Hans! Old conversation but I am trying to do something similar. For my mobile version I need to expand to fill so that the page fits the width of the screen. I prefer to just scroll down to see the rest of the page instead of having the white space down the right side but it gets cut off on the bottom. I have tried using your sample here that you provided but I can't seem to get it to work. All is good until you click the arrow to load the next scene. Then it gets cut off. Please help! I really need to get this working as I need it for various applications.
test.hype.zip (25.6 KB)
testVers001.hype.zip (36.7 KB)
Thank you Hans! Yes this is working really well now.
I am trying to wrap my head around all this sizing stuff and I have a question.
This is working well for my mobile when it is held vertical, now that you have amended it for me. I also have a full webpage layout in the same file with a breakpoint of 480px so when I turn the phone sideways it switches to the web sized view. Which is great!
However I am looking at the old file (before I added your code) and just wondering why it doesn't have that same white space down the right side in the horizontal view on the phone (the wider layout)? It seems to only be an issue when looking at it vertically. I have the settings set to "shrink to fit", "zoom contents checked" and "100% width scaling checked on". It stretches nicely across the width of the screen and there is no white space down the right side and it also does not get cutoff on the bottom. Why does it only have the white space and bottom crop in vertical mode? Is this just a function of the iphone? I would just like to understand this moving forward.
Although you have solved my problem! Just trying to figure things out.
there's no general answer ... it all depends on your setup.
you should setup very simple hypedocs to try and examine their responsive behavior.
then use those experiences for your production-documents.
online-documentation! <- read and try 
I've have read the part on responsive design. This instance seems to defy any rule of explanation! All good though. I will keep experimenting. Thank you so much, again for all of your help. Warm regards!
[quote="tammydesign, post:17, topic:15615"] This instance seems to defy any rule of explanation!
[/quote]
well not sure on this ...
those two:
play together and you'll need to know how ... pros, cons
throwing in a script will change those rules ...
Gotcha Hans! So much to learn. Still working on my coding skills. Will go through the docs again! Cheers and all the best:)
