CSS を使用せずに画像置換を行える Javascript「jQIR」
テキストを画像に置き換える場合は CSS で background に画像を指定するが、この「jQir」を使うと簡単なコードだけでテキストを画像に置き換えることが出来る。
必要な Javascript
【head 内】
<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>
【body 内 切り替え用ソース】
<h1 id="imagename" class="jpng">テキスト</h1>
詳細
class 指定で呼び出すことが可能になる。
id には該当のファイル名を入れる。
CSSで画像を制御したい場合は #該当のid名 img { hoge: ~;} で可能。
「jQIR」配布元(作者)
- 「CSS を使用せずに画像置換を行える Javascript「jQIR」」に関連するエントリー
- text-indent: -xxxxem 使用時の注意点
トラックバック(0)
このブログ記事を参照しているブログ一覧: CSS を使用せずに画像置換を行える Javascript「jQIR」
このブログ記事に対するトラックバックURL: