Hello everyone. How does one set a function to start animating a banner or presentation at the specific point in time like at a point where you see the banner only then start the animation.
I know its possible to do based window scroll value via javascript but im looking for a specific one where if banner is in focus play the animation. Can someone give me a Hype example?
Currently some of our affiliates use Hype ads that start animating by themselves some are at the middle some at the bottom of the page and until they scroll down the animation is done playing.
Are You referring to the “On Enter Viewport” action?
In this demo the appearance of a rectangle (containing a video) will trigger the video to begin playing when the rectangle appears in the viewport. This trigger could be an animation instead of a video of course - but with the video I get to demo a Hype feature request I made a while ago showing sound controlling animations (just to keep @daniel & @jonathan’s mind fresh on the possibilities ).
We take feature requests via Video demos the most seriously
For this viewport action method that Jim demoed to work, the ads would need to be embedded normally, not within an iframe. The iframe doesn't have information about where it is on the page.
Daniel good to see you here I hope your doing well. As you might have seen when I demoed our Affiliate ad portal we don’t use iframes in our embed code.
Additionally, The demo thats hosted on Business Catalyst doesn’t work for me. When I scroll down I see a black screen I tried clicking on it and waiting for it to load as well still it doesn’t seem to work on both desktop and mobile devices.
I’ll be sending you a msg with an Ad now see if you can figure it out.
Let’s try this version… a “Blue Square” that rotates (720°) when it is in the viewport. When the square is scrolled out of view it resets itself back to 0 degrees.
The main thing I am trying to show is how the mechanism works. I am not conversant with ad creation which might require some adaptation.
The function “rotateSquare()” does all the work. The triggers are “On Enter Viewport” & “On Exit Viewport” in the “Actions Inspector” for the “Blue Square” element.
what will this mean¿ within viewport? onmouseover¿ ontouchstart¿ ...¿
if it's regarding to position you'll have to check how your ad-service-provider embeds the ads and they may offer some API to control their ad-container ...
).
I hope your doing well. As you might have seen when I demoed our Affiliate ad portal we don’t use iframes in our embed code.