以前、YouTubeの動画を動的にローディングする方法について書きましたが、実はその際に、FullScreenモードには対応していませんでした。
で、対応方法は
| var params = { allowScriptAccess: "always" }; ・・・省略・・・ swfobject.embedSWF("http://www.youtube.com/e/" + prms.movieData + "?version=3&enablejsapi=1&hl=ja_JP&playerapiid="+prms.playerId, ・・・省略・・・); ・・・省略・・・ |
| var params = { allowScriptAccess:'always', allowfullscreen:'true'}; ・・・省略・・・ swfobject.embedSWF("http://www.youtube.com/e/" + prms.movieData + "?version=3&enablejsapi=1&hl=ja_JP&fs=1&playerapiid="+prms.playerId, ・・・省略・・・); ・・・省略・・・ |
最終的には、下の形に落ち着きます。
| <!DOCTYPE html> <html> <head> <script type="text/javascript" src="./jquery.js"></script> <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/swfobject/2.2/swfobject_src.js"></script> <script type="text/javascript"> function onYouTubePlayerReady(playerId) { } jQuery.extend({ loadYoutube:function(args){ prms = $.extend({ width:"420", height:"345", version:"9" },args); var params = { allowScriptAccess:'always', allowfullscreen:'true'}; var atts = {id: prms.embedId}; swfobject.embedSWF( "http://www.youtube.com/e/" + prms.movieData + "?version=3&enablejsapi=1&hl=ja_JP&fs=1&playerapiid="+prms.playerId, prms.id , prms.width, prms.height, prms.version, null, null, params, atts ); } }); jQuery(document).ready(function(){ jQuery.loadYoutube({ id:"js_movie", playerId:"ytplayer1", embedId:"ytPlayer1", movieData:"R0ks1U2C6aI" }); }); </script> </head> <body> <div id="js_movie"></div> </body> </html> |
0 コメント:
コメントを投稿