Visitar URL original
The last half! by LHJE · Pull Request #5 · LHJE/JavaScript30 · GitHub
Skip to content

The last half! #5

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
LHJE merged 17 commits into from
Jul 7, 2021
Merged

The last half! #5

Changes from 1 commit
Commits
Show all changes
17 commits
Select commit Hold shift + click to select a range
220321d
Update 14 with logic from tutorial
LHJE Jun 1, 2021
c507777
Update 15 with logic from tutorial
LHJE Jul 7, 2021
394aa8a
Update 16 with logic from tutorial
LHJE Jul 7, 2021
ddd2487
Update 17 with logic from tutorial
LHJE Jul 7, 2021
b09d9e3
Update 18 with logic from tutorial
LHJE Jul 7, 2021
b418aa0
Update 19 with logic from tutorial
LHJE Jul 7, 2021
322775e
Update 20 with logic from tutorial
LHJE Jul 7, 2021
4812331
Update 21 with logic from tutorial
LHJE Jul 7, 2021
3115a69
Update 22 with logic from tutorial
LHJE Jul 7, 2021
26f4a80
Update 23 with logic from tutorial
LHJE Jul 7, 2021
35bb7f0
Update 24 with logic from tutorial
LHJE Jul 7, 2021
6fb0053
Update 25 with logic from tutorial
LHJE Jul 7, 2021
d104894
Update 26 with logic from tutorial
LHJE Jul 7, 2021
1c8e753
Update 27 with logic from tutorial
LHJE Jul 7, 2021
8b3162f
Update 28 with logic from tutorial
LHJE Jul 7, 2021
23166bc
Update 29 with logic from tutorial
LHJE Jul 7, 2021
073566a
Update 30 with logic from tutorial
LHJE Jul 7, 2021
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Prev Previous commit
Next Next commit
Update 28 with logic from tutorial
  • Loading branch information
@LHJE
LHJE committed Jul 7, 2021
commit 8b3162f7802a29a60bcf5f8044323244c09b5e58
17 changes: 17 additions & 0 deletions 28 - Video Speed Controller/index-START.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -15,6 +15,23 @@
</div>

<script>

const speed = document.querySelector('.speed');
const bar = speed.querySelector('.speed-bar');
const video = document.querySelector('.flex');

speed.addEventListener('mousemove', function(e) {
const y = e.pageY - this.offsetTop;
const percent = y / this.offsetHeight;
const min = 0.4;
const max = 4;
const height = Math.round(percent * 100) + '%';
const playbackRate = percent * (max - min) + min;
bar.style.height = height;
bar.textContent = playbackRate.toFixed(2) + 'x';
video.playbackRate = playbackRate;
});

</script>
</body>
</html>