I am a new Hype user and I am very impressed! I am currently using BlocsApp to design my website and have no coding/advanced knowledge at all.
I am trying to design an animated carousel banner with Hype which I have managed to do to my satisfaction thanks to the easy-to-use software. I have downloaded the Hype Bric for Blocs and it looks great. However it isn't responsive so most of the banner is off the screen when viewed on anything smaller than a PC monitor.
I have seen how to make the banner responsive by using the "flexible layout" and adjusting the pins and "shrink to fit" options to make the banner responsive. On the preview it works really well and I am very pleased.
Unfortunately when I then import it into Blocs, it doesn't show - there is just a blank space. I feel that it is something to do with the flexible layout settings but my knowledge isn't strong enough to understand what the problem is. Can anyone help?
This might be related to the 100% height you have set for the Hype scene, and Max's suggestion might help. If the element you're placing your Hype document into (in Blocs) doesn't have a height, then the height of your document will be 100% of zero ( 0 ).
Thank you @MaxZieb and @Daniel for your suggestions. I think Max's flexible slider is what I am looking for. I need the width to be responsive and the height should change relative to the width so that the ratio remains the same.
I have imported Max's "flexible slider" example into Blocs (without making any changes) and it still doesn't show.
The "auto height slider" example does work so I think you are on to something.
The flexible slider doesn't set any height. It is set to 100% height of the parent node (like @Daniel explained) meaning you would have to create a wrapper actually setting the height for you or just defining it in the height options in the Hype Scene panel (not enabling the 100% checkbox). You could also set the height using a CSS class and using a height defined in a unit like px or vh. I started a page on Hype Cookbook on the topic but it's still Work In Progress:
Thank you. I have not understood everything you have said. I am sure it makes sense and is correct but I am at a very low skill level on Hype at the moment. However, using Max's example as a template I have managed to get my banner as I desire and it seems to be perfectly responsive on Blocs.
Thank you both so much for your help. I am truly grateful.
To make a Hype Animation responsive for blocs you have to check the scences settings. There check the checkbox for width 100%. Don't check the hight... i don't know why, but it works
