Site logo

Archived topic

Scroll through video when scrolling down

10 replies · Started by Ivan Cazorla on May 31, 2018

Viewing posts 1–11 of 11

Hi there, is there any way to scroll through one video with a fixed position as you keep scrolling down?

Website example is located at the end of the landing page, just before the footer: https://www.audi.es/es/web/es/modelos/a7/nuevo-a7-sportback.html

Or is it better to achieve the same effect using photos?

thanks,
ivan

Hi Ivan,

the element itself has a sticky property attached to it like so:

div {
	position: -webkit-sticky;
	position: sticky;
	top: 0;
}

This will always stick the element when it reaches the top of the screen - the video player is using a on scroll script to animate and to remove the sticky property when video is ended. I am not sure where to begin with that one!

The stick to the top works now and I'll try to find another solution for the video scroll script thing.

What kind of script should I use to remove the sticky property when the div is ended?

thanks,
Ivan

That get's quite complicated, considering a stuck element never scrolls off the screen. It either needs to be nested in a container that can scroll or another element to push it off the screen. For this sort of function you may want to check out this plugin:

https://wordpress.org/plugins/sticky-menu-or-anything-on-scroll/

Doing this with the video player gets even more complex, i haven't been able to find all the code or a plugin that can do this.

Hi there, thanks I'll check that out. I've found a plugin called Scroll Magic that in theory should work, but I've tested it out and seems to not work with GeneratePress.

http://scrollmagic.lamblue.com/sequence-images/

thanks,
Ivan

thanks, haven't found the issue why this plugins doesn't work with GeneratePress though.

thanks,
Ivan

Have you tried it on the TwentySeventeen theme?

Oh, nope. I should try it on that one, but regardless it works or not, I'd need it to be working on GeneratePress because that's the theme I'm most used to and want to work with.

thanks,
ivan

Hi Ivan, it's a good way of testing if there is a conflict between a plugin and GP, if it doesn't work on TwentySeventeen then, well i would say its outdated code, if it does work then maybe it's something we can investigate.

Makes sense, I'll try it out now and let you know.

This archived topic is closed to new replies.