php - YouTube API, jQuery attr won't swap element attributes -
javascript (jquery)
function display_youtube(new_url) { $('#movie_url').removeattr('value'); $('#embed_url').removeattr('src'); $(document).ready(function() { $('#movie_url').attr('value', new_url); $('#embed_url').attr('src', new_url); $('#shade').css('display', 'block'); $('#youtube_player').css('display', 'block'); $('#exit_youtube').css('display', 'block'); }); }
html
<object width="720" height="480"> <param id="movie_url" name="movie" value="http://www.youtube.com/v/_eatocsn7yu?f=user_uploads&app=youtube_gdata&autoplay=0" /> <param name="allowfullscreen" value="true" /> <param name="allowscriptaccess" value="always" /> <embed id="embed_url" src="http://www.youtube.com/v/_eatocsn7yu?f=user_uploads&app=youtube_gdata&autoplay=0" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="720" height="480" /> </object>
hyperlink
<a href="javascript:display_youtube('http://www.youtube.com/v/_eatocsn7yu?f=user_uploads&app=youtube_gdata&autoplay=1');">click here fun!</a>
what i've done parsed youtube's api videos on user channel.
the hyperlink above php generated, meant trigger above javascript function, , swap url attributes contained in ids "movie_url" , "embed_url" works should in ff, ie perform .css commands.
my guess ie doesn't me assigning ids param , embed.
fixed it! new code listed below. issue ie's handling of flash parameters (wouldn't perform async refresh of params object). working fine in ff because embedding video, , not handling object.
new javascript
function display_youtube(new_url) { $('#object_url').replacewith('<param id="object_url" name="movie" value="' +new_url+ '" />'); $('#embed_url').replacewith('<embed id="embed_url" src="' +new_url+ '" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="720" height="480" />'); $('#shade').css('display', 'block'); $('#youtube_player').css('display', 'block'); $('#exit_youtube').css('display', 'block'); } function exit_youtube() { $('#object_url').replacewith('<param id="object_url" />'); $('#embed_url').replacewith('<embed id="embed_url" />'); $('#shade').css('display', 'none'); $('#youtube_player').css('display', 'none'); $('#exit_youtube').css('display', 'none'); }
new html
<object width="720" height="480"> <param id="object_url" /> <param name="allowfullscreen" value="true" /> <param name="allowscriptaccess" value="always" /> <embed id="embed_url" /> </object>
i think trick here force ie rely on instructions jquery before perform actions whatsoever on object, in effect preventing ie caching parameters start. ftw!
Comments
Post a Comment