【メモ】フレームの幅を変更するJavaScript

今やフレームをページ全体に使用したサイトは殆ど見かけなくなりましたが、
使用しているRSSリーダー「フレッシュリーダー」はフレームで構成されています。
で、メニューフレームが若干狭いために未読件数が増えてくるとこんな感じにボタンがずれてしまうのですが。



「フレッシュリーダー」は殆どが暗号化されていてカスタマイズできないので調整は不可能です。

じゃあどうするか。
Greasemonkeyでやればいいんじゃね？

ということでやってみました。

フレッシュリーダーのメニューフレームの幅を調整するGreasemonkey

出来たコードはこんな感じ。

// ==UserScript==
// @name           Freshreader Wide
// @version        0.0.1
// @namespace      https://nplll.com
// @description    Freshreaderの幅を調整する
// @include        http://*/feedlist.php*
// @updated        2010-04-17 12:00:00
// ==/UserScript==
// 0.0.1 - 2010/04/17 リリース

(function(){
//未読数が4桁の時メニューフレームを調整する
if (document.getElementById('top_category').innerHTML.length > 19) {
parent.document.getElementsByName('frameset')[0].cols = '260,*';
}
})();

見出しの長さが一定以上になったらほんの少しメニューフレームを広げる。それだけ。
それだけなんだけど自分的にはちょっと便利になりました。

嵌ったところ。

JavaScriptでフレームをいじるとかあんまりやらないのでちょっと勝手がわからず実は苦戦しました。

親フレームからframesetが操作できない

まず嵌ったのはこれ。

次のようなファイルがあるとして、

parent.html

このframsetを操作しようと、parent.htmlに以下のように書いても動かない。

document.getElementsByName('frameset')[0].cols = '50%,50%';

こうしても同じ。

top.document.getElementsByName('frameset')[0].cols = '50%,50%';

これは、子フレームから操作してやるようにすると解決する。

menu.html

そうなのかー。

nameでフレームのオブジェクトを取得する

最近は何をするにしてもid、悪くてもTagNameで、name要素を使う機会はほとんど無い（フォーム部品を除く）のだけど、この場合はないので仕方がない。
というわけで、適当に

document.getElementByName('frameset');

とかやってみたけど出来るはず無くて、こうでした。

document.getElementsByName('frameset')[0];

まぁオブジェクトさえ取得できてしまえばあとは何でも出来ますね。



こんな感じで。