Scrollable overlay element - Popup within the scene area


(Eric ) #1

Good evening all

I am recreating a flash movie in Hype 3 and on a click event it pops open a scrollable type window with text and images and a close button

What is the best way to achieve this in Hype? I cannot use a scrollable textbook as I need images as well

Many thanks in advance

Eric


#2

Does this scrollable text element exist in the same window? Or does it create a popup?

It’s pretty easy to do this within the same window – the text element could exist off scene, and you could animate it onto the scene (or have it instantly appear with the ‘instant’ transition) after the click event.

Not sure what you mean by this:

Here’s how you can use JavaScript to create a popup window if you’re hoping to make an entirely separate window: http://www.quirksmode.org/js/popup.html


(james koh) #3

@Daniel

he means he can not use the scrollable text box only because he wants to have images as well as the text.

@ericb
You can export image + text as a jpg or png file and make that file to move to down in timeline.
put a invisible box above that file and make an drag to control timeline action.


(Eric ) #4

Thanks for your feedback.

I am try to recreate the following popup type window:

http://www.beeflambnz.com/Global/Microsite/index.html

Enter the site, click on the beef menu, then click on the carcass menu and click one of the items down the side to get the window to open up.

Yes I could do it with an image but it will need to be scrollable because of the length and I need to incorporate a close button as well

Thanks in advance

Eric


#5

Ok, to recreate this, you would just use regular elements and a timeline to trigger the appearance of this overlay. It’s not really a ‘pop up’ – it can be made with standard elements which anime onto the scene based on a timeline’s animations.

People commonly use a single timeline for showing and hiding these types of elements: Use a ‘pause’ timeline action to pause the timeline on the overlay’s ‘visible’ state, and then link the ‘X’ button to run a ‘continue timeline’ timeline action which would then remove the overlay from the visible scene area.