Difference between revisions of "Msc1G3:Student2"
| Line 19: | Line 19: | ||
</div> | </div> | ||
<br> | <br> | ||
| + | |||
| + | <html>var tag = document.createElement('script'); | ||
| + | tag.src = "http://www.youtube.com/player_api"; | ||
| + | var firstScriptTag = document.getElementsByTagName('script')[0]; | ||
| + | firstScriptTag.parentNode.insertBefore(tag, firstScriptTag); | ||
| + | |||
| + | var player; | ||
| + | function playThis(elem) { | ||
| + | player = new YT.Player(elem.attr('id'), { | ||
| + | events: { | ||
| + | 'onReady': function(){player.playVideo(); player.mute();} | ||
| + | } | ||
| + | }); | ||
| + | }</html> | ||
| + | |||
| + | <html> | ||
| + | $(window).scroll(function() { | ||
| + | clearTimeout($.data(this, 'scrollTimer')); | ||
| + | $.data(this, 'scrollTimer', setTimeout(function() { | ||
| + | // do something | ||
| + | isScrolledIntoView(); | ||
| + | }, 250)); | ||
| + | }); | ||
| + | |||
| + | function isScrolledIntoView() | ||
| + | { | ||
| + | $('.collageYoutube').each(function(){ | ||
| + | var docViewTop = $(window).scrollTop(); | ||
| + | var docViewBottom = docViewTop + $(window).height(); | ||
| + | |||
| + | var elemTop = $(this).offset().top; | ||
| + | var elemBottom = elemTop + $(this).height(); | ||
| + | |||
| + | if ((elemBottom <= docViewBottom) && (elemTop >= docViewTop)) | ||
| + | { | ||
| + | playThis($(this)); | ||
| + | }else{ | ||
| + | pauseThis($(this)); | ||
| + | } | ||
| + | }); | ||
| + | }</html> | ||
<html><iframe width="850" height="450" src="https://www.youtube.com/embed/mk6YstVzj6k?controls=0;rel=0&autoplay=2" frameborder="0" allowfullscreen></iframe></html> | <html><iframe width="850" height="450" src="https://www.youtube.com/embed/mk6YstVzj6k?controls=0;rel=0&autoplay=2" frameborder="0" allowfullscreen></iframe></html> | ||
<html> <iframe width="850" height="450" src="https://www.youtube.com/embed/0rudRJe8dbQ?controls=0;rel=0&autoplay=2" frameborder="0" allowfullscreen></iframe> </html> | <html> <iframe width="850" height="450" src="https://www.youtube.com/embed/0rudRJe8dbQ?controls=0;rel=0&autoplay=2" frameborder="0" allowfullscreen></iframe> </html> | ||
Revision as of 11:25, 25 January 2016
PARAMETRIC - SIMULATION
var tag = document.createElement('script'); tag.src = "http://www.youtube.com/player_api"; var firstScriptTag = document.getElementsByTagName('script')[0]; firstScriptTag.parentNode.insertBefore(tag, firstScriptTag); var player; function playThis(elem) { player = new YT.Player(elem.attr('id'), { events: { 'onReady': function(){player.playVideo(); player.mute();} } }); }
$(window).scroll(function() { clearTimeout($.data(this, 'scrollTimer')); $.data(this, 'scrollTimer', setTimeout(function() { // do something isScrolledIntoView(); }, 250)); }); function isScrolledIntoView() { $('.collageYoutube').each(function(){ var docViewTop = $(window).scrollTop(); var docViewBottom = docViewTop + $(window).height(); var elemTop = $(this).offset().top; var elemBottom = elemTop + $(this).height(); if ((elemBottom <= docViewBottom) && (elemTop >= docViewTop)) { playThis($(this)); }else{ pauseThis($(this)); } }); }
