手違いにより社員紹介ページから消滅中のagoです。
今日は全画面ジャック型のblogpartsを一つのswfのみで実装する方法を紹介したいと思います。
まず、一般的な全画面ジャック型blogpartsの場合、最初に表示されているsidebar swf（記事内に貼り付けるタイプであれば記事内のswf）と全画面ジャック用swfが分かれており、何らかのイベント（sidebar swf内のボタンクリック等）の発生後全画面swfが読み込まれる形が一般的だと思います。
//sidebar swfの読み込み
document.write((new SWFObject('mail.swf', 'blogparts_external_main_id', '160', '340', '9', '#FFFFFF')).getSWFHTML());
//全画面ジャック実行
blogparts_object.jack_swf = function () {
$(document.body).append((new SWFObject('jack.swf', 'blogparts_external_jack_id', '100%', '100%', '9', '#FFFFFF')).getSWFHTML());
var scroll_top = Math.max((document.body.scrollTop || 0), (document.documentElement.scrollTop || 0), 0);
//全画面への展開
$('#blogparts_external_jack_id').css({
'top' : scroll_top,
'left' : 0
});
};
・一般的なblog parts実装例
ただ、この形式の場合sidebar swfと全画面swfで一体的な動作を行うのが難しく、たとえばsidebar swf内で映像を流しつつ、その映像がそのままsidebar swfの領域外に流れ出すような表現は実装が困難です。
（sidebar swfと全画面swfを同期させ、sidebar swfの上に全画面swfがうまく覆うように表示させる事も可能ですが、映像等を切れ目無く表示させることは非常に難しいと思います）
実装が困難な理由として、普通のimg tagであれば一時的にstyle属性をposition:absoluteに設定し、位置を調整するれば問題ないのですが、object tag(or embed tag)はそのtagと影響するすべての親tagのpositionを変更するとswfの内容がreloadされる（サーバへswfを再度読みに行く）という特殊な事情があります。
（2008/09/08追記 ちなみに、styleのoverflowを変更しても同じようにswfがreloadします）
この問題を解決するには、最初のsidebar swf表示時にはswfのサイズと同じサイズの空divを出力し、sidebar swfはposition:absoluteのまま先に出力したdivの真上に出力するこでpositionを変更しないまま位置を調整するという方法があります。
//sidebar swfの読み込み
document.write('<div id="blogparts_external_main_wrap_id" width="160" height="340"></div>');
$(document.body).prepend((new SWFObject('mail.swf', 'blogparts_external_main_id', '160', '340', '9', '#FFFFFF')).getSWFHTML());
var offset_fix = function () {
$('blogparts_external_main_id').css($('#blogparts_external_main_wrap_id').offset());
};
offset_fix();
//window resizeに追従
$(window).resize(offset_fix);
//全画面ジャック実行
blogparts_object.jack_swf = function () {
var scroll_top = Math.max((document.body.scrollTop || 0), (document.documentElement.scrollTop || 0), 0);
//全画面への展開
$('blogparts_external_main_id').css({
'width' : '100%',
'height' : '100%',
'top' : scroll_top,
'left' : 0
});
};
・単一swf blogparts実装例
この方法であればswfのリロードが発生しないため、貼り付け後のswfの位置調整を自由に行うことができます。 （もちろん、その分swfの位置調整が難しくなる問題はありますが）
映像を使うブログパーツを作成する場合使える手法ではないかと思います。
