I am trying to put a video in A webpage project By “Inline”, unchecked “Controls” and “Autoplay”, Screenshot: http://prntscr.com/kpnwvv
By this way, I want the video only play “On Enter Viewpoint”. I found there is only option of playing sound, but no option for playing a specific video, Screenshot:
And I tried to make it work by custom behaviour, but it seems same situation.
I searched in this forum, but found nothing upon this feature. So, is it possible to make it play only “On Enter viewpoint” please?
Instead of triggering a custom behavior, run a JavaScript file. Then, you could do this...
hypeDocument.getElementById('video1').play();
That’s from here...
Personally, I usually just have one main JavaScript file, where I manage just about everything in the project. It’s more work, but then I have greater control. It’s the same with video. I usually load the video with HTML code, instead of using Hype’s video element. That way, I can easily add captions. If I want to control the video, I just use standard HTML Audio/Video DOM methods...
I mean I just want to make a product image or other element to be enlarged when navigated down, would you please let me know what is the javascript in Hype to do that, or how to make that work please?
Thanks, in my Hype project, there are two layouts for PC and mobile, and I found it require unique ID.
and I assigned IDs as: waterdrop and waterdropmobile,
Unless you use Advanced Export to separate layouts into different exports, a single document will have both layouts and their included DOM elements/IDs.
The Hype API has a hypeDocument.currentLayoutName() function that you can check against to conditionalize the .play() function. Example:
I tested you code, unfortunately, it does not work for me when I set the javascript running On enter viewpoint, so, for test purpose, I add to buttons of Play and Pause, and two Javascripts:
Thanks, Yes, it works, when I say it does not work for mobile, I mean it does not work in Wordpress, and there is a issue with wordpress same as this one How to make video align center please
it is invisible if not group it and make it align center.
Sorry for mislead you, it works fine now, and you may check the mobile mode at:
Uncaught (in promise) DOMException: The play() request was interrupted by a call to pause(). https://goo.gl/LdLk22
Basically a play() and pause() call are happening in rapid succession.
It looks like the root cause is a bug in Hype where elements using flexible layout will trigger waypoints incorrectly. This has been filed to fix.
The easiest workaround is probably to use the on enter/exit actions on an element that is not set to use flexible layout, like an empty rectangle that is the same top position and height of your video.
(Interesting adding a try/catch block does not catch the error).
In your case it is pretty harmless, so you could also do nothing and I think be okay as well if you don’t mind a little console spew.