YappoLogs

既存のページにもんたメソッドを簡単に組み込むツールを作った

いま巷を騒がせているもんたメソッドですが、あのプレゼンを再現しようとしたツールが２つ登場しています。
もんたメソッドなプレゼン作成ツール
もんたメソッドなプレゼンツール in XUL

miyagawaメソッドとかカカクメソッドとか、○○メソッドという用法が普及しそうな感じですな。

実は、自分も作ろうとしていた所なのですが、これらプレゼン風のツールとは違い
簡単にWebサイトに貼り付けられる物を作りたかったのです。
せっかくなのでサクッと作りました。

以下もんたメソッド for Webサイトによる説明です（塗りつぶされてる所はクリックです）

もんたメソッド for Webサイト　とは？

どんなページにも簡単にもんたメソッドを組み込む為の、小さいJavaScriptです。
このページのように、重要そうな文字を隠しておくことが出来ます。

貼り付けかたは
http://tech.yappo.jp/download/monta.js.txt
からJavaScriptを取得して、適当なURLにファイルを保存します。
そして、保存したJavaScriptファイルを外部から呼び出すようにHTMLを編集します。
onLoadに指定するのはちょっとやなので、htmlの後ろの方に<javascript src="　なタグを組み込みます。

たとえば、このページは

<script type="text/javascript"><!--

var monta_close_font = '#00f';

var monta_close_back = '#00f';

var monta_open_font = '#f00';

//--></script>

<script type="text/javascript" src="http://tech.yappo.jp/download/monta.js"></script>

で、実際に隠したい文字列を<span monta="on"></span>で囲みます。
spanタグにmonta属性を勝手に追加した形になります。
また、いくつかの変数に値を入れて置く事により、色などの変更が出来ます。

monta_close_font - 文字を隠すときの文字色
monta_close_back - 文字を隠すときの背景色
monta_open_font - 文字を表示したときの文字色
monta_open_back - 文字を表示したときの背景色
monta_close_img - 文字を隠したときの背景画像

var monta_close_img = 'url(http://example.com/back.jpg)';

のように利用する。
（でもMTで使うとうまく色がつかないorz）

適当な実装ですが、違和感無くもんたメソッドを組み込めるかと思います。

Posted by Yappo at 2005年05月31日 23:23 | TrackBack | tech