ニュースチャンネル風文字サイズ変更ライブラリ「WNLike」
2007年02月02日-
WNLike
ニュースチャンネル風文字サイズ変更ライブラリ「WNLike」。
60%,80%,100%といったボタンをおすと、文字がアニメーションしながら拡大/縮小されます。
フォントサイズを変更するライブラリはありましたが、アニメーションするのはなかなか面白いですね。
使い方は、まずscriptを読み込んでおきます。
<script type="text/javascript" src="wnlike.js"></script>
次にオブジェクトを初期化します。
<script type="text/javascript">
var wiiObj = null;
function init() {
wiiObj = new WNLike("target");
}
</script>
WNLikeの引数のtarget 部分は、文字のサイズを変えたい要素のid名を指定します。
この場合、<div id="target"></div> の要素に対して影響を与えます。
次に拡縮のためのボタンを配置。wiiObj.resize('xxx%'); として呼び出します。
<button onclick="wiiObj.resize('60%');">60%</button>
<button onclick="wiiObj.resize('80%');">80%</button>
<button onclick="wiiObj.resize('100%');">100%</button>
<button onclick="wiiObj.resize('120%');">120%</button>
<button onclick="wiiObj.resize('140%');">140%</button>
簡単に使えて、それなりに実用的なのでなかなか使えそうですね。
関連エントリ
最新のブログ記事(新着順)
- PHPユーザのためのPythonとGoogle App Engine勉強会
- 2chのdat落ちしたスレを右クリックで即座に蘇生させられるFirefoxアドオン「fire2chDat」
- FlashがブロックされているかJavaScriptで判断できるようになる「flashblockdetector」
- 2010年3月14日 管理人のブックマーク
- 2010年3月9日 管理人のブックマーク
- かなりカッコいいPHP&MySQLなAjax式コンタクトフォーム
- PHPによってCSSを動的に出力する初心者向けチュートリアル
- ジェスチャーの指示が超分かりやすくできるベクターアイコン集「Gesturecons」
- CSSを使ったOperaブラウザのロゴがすごい
- スクロールさせると日が沈んでいく面白いサイト「Morning Sunset」


















間違いの指摘をしていただける方はメールでお願いします(クリック)


