Flashの前面にHTMLの要素を表示させる。

ニコニコ動画 Greasemonkey

今作っているnicovideo Thumbinfo popupのポップアップウインドウを，ニコニコ動画の動画再生プレイヤーの前面に表示させたい。
どうやら，Flashのwmodeというパラメータをいじればいいらしいい。こんなスクリプトを書いた。

if(location.href.indexOf('http://www.nicovideo.jp/watch/') == 0) {
    var flvplayer = document.getElementById('flvplayer');
    flvplayer.style.display = 'none';
    flvplayer.setAttribute('wmode', 'transparent');
    setTimeout(function() { flvplayer.style.display = ''; }, 10);
}

一応できた。

しかし，このやり方だと，プレーヤーが表示・非表示を繰り返し，その度に動画をサーバーに読み取りにいくので，PCにもサーバにも優しくありません。
場合によっては通信制限がかかって動画再生まで待たされることも。
一度非表示にしなくてもFlashプレーヤーが設定を即時反映してくれればいいんですが。何かいい方法をご存じの方がいらっしゃったら教えてくださるとありがたいです。

2008/6/27 10:56 追記

UserStyleと組み合わせることでとりあえずは解決。こんなスタイルを書いた。

@-moz-document url-prefix("http://www.nicovideo.jp/watch/") {
    #flvplayer { display: none;}
}

if(location.href.indexOf('http://www.nicovideo.jp/watch/') == 0) {
    var flvplayer = document.getElementById('flvplayer');
    if(getComputedStyle(flvplayer, '').display == 'none')
        flvplayer.setAttribute('wmode', 'transparent');
    flvplayer.style.display = 'block';
}

これで動画の2重読み込みは無くなり，通信制限をうけることも無くなります。
ユーザースタイルを導入すればポップアップが前面に表示されるようになって少し使いやすくなります。

20:20 追記

コメントが入力できなくなるというMac版のFirefoxみたいな不具合が起きた。
Firefox3.01で直るのかな。これ。

21:32 追記

調べてみると，日本語入力できなくなるのはFlash Playerのバグらしい。なんだとー。
こりゃ回復は見込めないな。Flash Playerのver.10で直ってるといいな。
ニコニコで日本語入力できないのは致命的だし，もう一度position: fixed; の方法を試してみるか。

23:04 追記

position: fixed; でやる方法，昨日やったときは出来なかったのに，今やったらできた。よく分からないけど，まあできたのならいいか。
動画再生ページだけfixedにするようにしました。
ページがスクロールしたとき，fixedなのにabsoluteのような動作をするようにしました。言葉で説明するよりソース貼った方が早いかな。

if(is_watchpage) {
    var sTop = document.documentElement.scrollTop;
    var sLeft = document.documentElement.scrollLeft;
    window.addEventListener('scroll', function(e) {
        var dx = document.documentElement.scrollLeft - sLeft;
        var dy = document.documentElement.scrollTop - sTop;
        popups.forEach(function(popup) {
            popup.popup_div.style.top = (parseInt(popup.popup_div.style.top, 10) - dy) + 'px';
            popup.popup_div.style.left = (parseInt(popup.popup_div.style.left, 10) - dx) + 'px';
        });
        sTop = document.documentElement.scrollTop;
        sLeft = document.documentElement.scrollLeft;
    }, false);
}