グラデーション文字
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html lang="ja">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS">
<title>グラデーション文字</title>
<script src="gradation.js"></script>
</head>
<body style="background-color:black;">
<div style="font-size:20pt;">
<script language="javascript">
document.write(gradationTxt("Web小ワザライブラリー","red",0) + "<br>")
</script>
</div>
</body>
</html>
スクリプトでグラデーション文字を自動的に生成します。まずは、gradation.jsをHTMLファイルと同じフォルダに置き、グラデーション文字を表示させたいHTMLファイルの<head>〜<head>に次の記述を追加します。
<script src="gradation.js"></script>
あとは、グラデーション文字を表示させたい位置に、次のように書いてください。
<script language="javascript">
document.write(gradationTxt("あ","い",う))
</script>
▼あ
グラデーション表示させたい文字を書きます。ダブルクォーテーションで囲んでください。
▼い
色を指定します。指定できる色は「red」「green」「blue」「yellow」「pink」「water」「mono」の7つです。ダブルクォーテーションで囲んでください。
▼う
グラデーションの方向として「0」か「1」を指定します。「0」だと"色→指定した色"になり、「1」だと"指定した色→白"になります。
なお、改行が必要なときは次のように書けばOKです。
<script language="javascript">
document.write(gradationTxt("あ","い",う) + "<br>")
</script>
また、見出しとして利用したいときは、次のように、全体を<h1>〜</h1>などで囲めばOKです。
<h1>
<div>
<script language="javascript">
document.write(gradationTxt("あ","い",う))
</script>
</h1>
ホームページ作成ガイド
ホームページ作成ガイド