HOW TO CREATE A “STICKY” FLOATING VIDEO ON PAGE SCROLL

Author:

  • Louie Rootfield
  • webdesign.tutsplus.com
  • 07.03.2017

Made with:

  • HTML
  • CSS
  • JavaScript (jQuery.js)

About the tutorial:

“If you have found yourself browsing media websites recently–video streaming services, news websites, Facebook and so on–you might have noticed a trend regarding their video players. If we scroll down a page where a video is present, it will float and shrink the player, sticking it to the side of the viewport instead of losing it from view. This allows the users to keep an eye on the video, whilst looking through the other content at the same time. In this tutorial I’m going to show you how to recreate the same experience–so without further ado, let’s get started!”

Tutorial Demo

Add a Comment

Your email address will not be published. Required fields are marked *