Skip to content

Instantly share code, notes, and snippets.

@usmaanalii
Created September 6, 2017 08:01
Show Gist options
  • Save usmaanalii/4d496e43f3adc9344d41ad641d0203f7 to your computer and use it in GitHub Desktop.
Save usmaanalii/4d496e43f3adc9344d41ad641d0203f7 to your computer and use it in GitHub Desktop.

28. Video Speed Controller

What I learned on this mini-project.

offsetHeight

This property represents the height of an element, including vertical padding and borders. It is measured in pixels and is returned as an integer.

https://gist.github.com/a26129f52bd13ff12b75aa32e4d90925

In this case, offsetHeight was used in the percentage calculation used to fill the speed-bar.

Normalize value

It made sense for the speed-bar to have appropriate minimum and maximum values, to achieve this, normalization was used, allowing us to map the percentage scrolled, to these minimum and maximum values.

https://gist.github.com/69a9ae7b1d7aae34da6b6c1d3eaa225d

In this case, minimum = 0.4 and maximum = 4. So, the percentage scrolled would fall between the two. For example 10% is approximately equal to a playBackRate of 0.43.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment