jQuery, delay link replacing iframe target -


i have simple grid layout 4 thumbnails, each link inside changes target of single iframe sits @ top of page. these work fine, want add slight delay iframe's target changing allow page scroll top after each click.

here iframe code;

<iframe id="video-frame" name="video-frame" width="560" height="315" src="[youtube-url]" frameborder="0" allowfullscreen></iframe> 

this play button code (of there 4, each different href values;

<a class="play-button" href="[youtube-url]">&nbsp;</a> 

and jquery code scrolls page top on each .play-button click

$('.play-button').click(function(){     $('html, body').animate({ scrolltop: 0 }, 500);     $('#video-frame').attr("src", $(this).attr("href")); }); 

my issue changing of iframe src causes scroll glitchy need add 650ms delay changing of iframe src scroll has finished

if trying delay running function can try function :

$('.play-button').click(function(e){     e.preventdefault();     $('html, body').animate({ scrolltop: 0 }, 500);     setinterval(function () {$('#video-frame').attr("src", $(this).attr("href"));}, 650);         }); 

the set interval run function after given time 650 in our case meaning 650ms. try out , let me know if doesn't work


Comments

Popular posts from this blog

Fail to load namespace Spring Security http://www.springframework.org/security/tags -

sql - MySQL query optimization using coalesce -

unity3d - Unity local avoidance in user created world -