JavaScriptによる文字加工
自分のホームページ(HTMLファイル)をメモ帳で開いてみましょう。
以下のような英数字の文字列が表示されると思います。
必要な部分を必要な場所にコピー、ペーストするだけの簡単作業で、あなたのホームページにも取り付け可能です。
必要な部分を赤字にしてありますので、マウスで選択し、右クリックして「コピー」しましょう。
尚、大文字・小文字は関係ありません。
ここに記述されている文字が、クリックされたボタンによって色々と変化します。
|
<サンプル>
----------------------------- ここからHTML本文 -----------------------------
<HTML> ←必ず最初に記述があります。(1行目か2行目あたり)
<HEAD> ←必ず記述がどこかにあります。(比較的上の方)ここから下の赤字部分を、<HEAD>〜</HEAD>の間に記述します。
<title>メラメラ</title>
<SCRIPT LANGUAGE="JavaScript">
<!--
function changeGlowColor(theColor)
{
myText.filters["glow"].color = theColor;
}
function changeGlowStrength(theStrength)
{
myText.filters["glow"].strength += theStrength;
}
function setGrow(theFlag)
{
myText.filters["glow"].enabled = theFlag;
}
// -->
</SCRIPT>
</HEAD>
<BODY bgcolor="#000000" text="#FFFFFF"> ←比較的上のほうにあります。(<HEAD>タグの少し下あたり)ここから下の赤字部分を、<BODY>〜</BODY>の間で、表示したい場所に記述します。
<div id="myText" style="position:absolute;left:0px;top:0px;filter:glow(color=#f09000,strength=3,enabled=0)">
<h1><br>
</h1>
<table width="550" border="0" cellspacing="0" cellpadding="0">
<tr>
<td>
<div align="center">ここに記述されている文字が、クリックされたボタンによって色々と変化します。</div>
</td>
</tr>
</table>
<br>
<br>
</div>
<br><br>
<form>
<input type="button" value="ファイアーON" onClick="setGrow(1)">
<input type="button" value="ファイアーOFF" onClick="setGrow(0)">
<br>
<input type="button" value="メラメラ" onClick="changeGlowStrength(1)">
<input type="button" value="超メラメラ" onClick="changeGlowStrength(5)">
<input type="button" value="ふ〜っ" onClick="changeGlowStrength(-1)">
<input type="button" value="超ふ〜っ" onclick="changeGlowStrength(-5)">
<input type="button" value="イエロー" onclick="changeGlowColor(0xffff00)">
<input type="button" value="レッド" onclick="changeGlowColor(0xff0000)">
<input type="button" value="ブルー" onclick="changeGlowColor(0x0000ff)">
<input type="button" value="グリーン" onClick="changeGlowColor(0x00ff00)" name="button">
</form>
</BODY>
</HTML>
----------------------------- ここまでHTML本文 -----------------------------
|