Created
September 25, 2014 13:31
-
-
Save joeydi/7087fb720eeef1873a44 to your computer and use it in GitHub Desktop.
Attempt to play video frame by frame with scroll. Don't try this at home, kids.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
videos.each(function () { | |
var video = $(this).get(0); | |
video.addEventListener('loadedmetadata', function () { | |
console.log(video.duration); | |
}); | |
}); | |
skrollr.init({ | |
render: function(data) { | |
// console.log(data); | |
videos.each(function () { | |
var video = $(this), | |
video_node = video.get(0), | |
video_top = video.offset().top, | |
video_height = video.height(), | |
percent_visible, | |
time; | |
if (data.curTop >= video_top - $(window).height() - 200) { | |
percent_visible = (data.curTop - video_top + $(window).height() - 200) / (video_height - 200); | |
if ( percent_visible > 1 ) { | |
return true; | |
} | |
time = video_node.duration * percent_visible; | |
console.log(time); | |
if (!isNaN(time)) { | |
console.log('playing'); | |
video_node.currentTime = time; | |
} | |
} | |
}); | |
} | |
}); |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Hey, nice script!
But If i try to implement this, my video is going crazy...Can u link an example page to review the code of how to implement this correctly? :)
Thank you!