rico.jsによる「もっと読む」機能の実装

id:higepon:20050914:1126689576の続き。
Effect::Sizeを使う場合、隠れた部分の height が事前に分からないと厳しいと書いたところ。
http://synklab.net/blog/?itemid=74の中の人からトラックバックが来ました。
この問題を、非常にスマートに解決しています。
ポイントは

var entries = document.getElementsByClassName(className);
for (var i = 0; i < entries.length; i++) {
    var e = entries[i];
    showing[e.id] = false;
    saveHeight[e.id] = e.offsetHeight;
    e.style.visibility = 'visible';
    e.style.overflow = 'hidden';
    e.style.height = '1px';
}

のように、初期表示時に height を記録する部分です。(事前にもっと読む部分をスタイルシートで hidden にしておきます。)


あとは、height を Objectの連想配列を利用しているところがクールだと思いました。


ほとんどコピペですが、今回の肝となるコード(実際に動くもの)を上げておきます。
http://www.monaos.org/higepon/slide/slide.html


というわけで、はてなのサービスのどこかで使えると良いな。