oitake blog

いろいろリンク

おすすめリンク

最近のエントリー

カテゴリー

20101012:コメントとトラックバックを停止したことにより、このサイトはアーカイブとなりました。以降、ご連絡はみもねるのウェブサイトへお願いします。
20100703:新ナマコメ(ナマコメ 2)を公開しました。コメントビューア付きで送信面においてもパワーアップしています。
旧ナマコメは将来的に使用できなくする予定なので、可能な限り新ナマコメをお使いください。
20091127:oitake は みもねる になりました。当ブログは無期限更新停止となります。詳細は最新の記事をご覧ください。

スポンサーサイト

一定期間更新がないため広告を表示しています


2009.12.16 Wednesday | | - | - | -

タイポ!B(ブックマークレット)

※「バラバラ!」から「タイポ!」に名称変更しました。
前回の「タイポ!A」にフォントサイズもバラバラにする機能を追加しました。
「A」はマウスカーソルで道を作るところが面白いけれど、「B」は一段落まるごとバラバラにしてタイポグラフィみたいにするところが面白いです。


▲キレイにまとめられたページも


▲ラテンのリズムでアツくなります

使ってみたい方は、下記リンクをブックマークかお気に入りに登録してください(直接クリックしないでください)。
※OperaではOpera自身の不具合により動作しません。
※FirefoxではFirefox自身の不具合により動作しませんが、IEのお気に入りをインポートすれば動作します。

タイポ!B

といってもブックマークレットなので、自分一人で遊ぶのがオチです。
そんなわけで次回は、ページの一部分を最初からバラバラにする組み込みスクリプトを紹介します。

ソースコードは続きからどうぞ。

<ソースコード>

// - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
// タイポ!B(ブックマークレット) (C) 20061119 oitake
// - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
if(!window.opera)
{
g(document.body);
}
function g(o)
{
if(o)
{
g(o.firstChild);
g(o.nextSibling);
if(o.nodeType==3)
{
var e=document.createElement('span');
for(var i=0,s='';i<o.nodeValue.length;i++)
{
s+='<span onmouseover="this.style.cssText=¥'position:relative;'+(document.all?'zoom':'font-size')+':¥'+(Math.random()*75+75)+¥'%;left:¥'+(Math.random()*0.4-0.2)+¥'em;top:¥'+(Math.random()*0.4-0.2)+¥'em;¥'">'+o.nodeValue.charAt(i)+'</span>';
}
e.innerHTML=s;
o.parentNode.replaceChild(e,o);
}
}
}

スポンサーサイト


2009.12.16 Wednesday | 22:47 | - | - | -

アーカイブ

広告