4GALAXYのメモ

javascriptだけでテキストを画像に置き換えることが出来ます。コーディング作業が楽になります、

今まではテキストを画像に置き換える場合はCSSでbackgroundに画像を指定していたと思いますが、
JQueryプラグインjQirを使うと以下のコードだけでテキストを画像に置き換えることが出来ます。
コーディングしている方にはかなり良いプラグインではないでしょうか？

• jquery.js - ダウンロードページかならず必要ですのでダウンロードして下さい

コード

<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="jquery-jqir.js"></script>
<script type="text/javascript">
$(function(){
$(".jpng").jQIR("png", "image/");//png、imageフォルダの指定
$(".jjpg").jQIR("jpg", "image/");//jpg
$(".jgif").jQIR("gif", "image/");//gif
});
</script>
<!--▲head内-->
<h1 id="imagename" class="jpng">テキスト</h1>

DEMO - DOWMLOAD
classを指定することでどこからでも呼び出すことが出来ます。
idにはファイルの名前を入れます。CSSで画像を制御したい場合は#idname img{}で出来ます。
マークアップやコードの簡略化にとても役立つプラグインですね。
更に詳しい内容を知りたい方は作者さんのページへどうぞ。

jQIR

This entry was posted on 土曜日, 9月 15th, 2007 at 18:56:45 and is filed under jQuery, Ajax.You can follow any responses to this entry through the RSS 2.0 feed. You can leave a response, or trackback from your own site.