I’ve been working on replacing a bunch of traditional corporate sites with responsive sites while avoiding the more frankensteinish apps such as Dreamweaver. I have found that Hype is the best and most stable way of creating responsive content but due to loading restrictions, a heavy-duty Hype-based site was looking to be very problematic. Here’s a very basic example from Tumult:
http://tumult.com/hype/gallery/Nakuru/Nakuru.html
What I finally figured out was this - create each section of the vertical stack as a separate Hype document, then use a web design app to stack them as inline objects. The top couple of Hype objects will load quickly with the other Hype objects loading out of sight.
As for the vertical positioning of the stacked Hype objects, there is a vertical gap that occurs with inline objects, to overcome this, either use a background color that corresponds to the page color, or modify the code to compensate:
…div id=“index3manuf_hype_container” style=“margin-top:0px;margin-bottom;-15px;margin-right:auto;margin-left:auto;position:relative;width:100%;height:1080px;overflow:hidden;” aria-live=“polite”>
</div…
You may need to tweak the bottom margin.
By stacking the objects and using the web design app to control the loading sequence, you can get the result you are looking for.
A related tip - if you use two or more scenes for a section, make sure that the stage height is identical between pages. If you create an additional scene for a section that is taller than the “home” scene, the visitor scrolls to the bottom of the taller scene and then returns to the home scene, the top of the home scene could be out of view in the browser, with the object below jumping up to fill the space.