<html>
<head>
<title>文字にグラデーションをかけ1文字ずつ出力する</title>
<script Language="JavaScript"><!--
str = "■■■■■■■■■■■■■■■■■■■■■■■■■■";
count = 0;
function setText1()
{
if (count > str.length) return;
count++;
txt = str.substring(0,count);
txt2 = gradTextConv(txt);
if (document.all) document.all["outText"].innerHTML = txt2;
if (document.layers)
{
document.layers["outText"].document.open();
document.layers["outText"].document.write(txt2);
document.layers["outText"].document.close();
}
setTimeout("setText1()",100);
}
function gradTextConv(sText)
{
p = 16 / str.length;
str2 = "";
for (i=0; i<sText.length; i++)
{
pt = Math.floor(p*i);
n = "0123456789ABCDEF".charAt(pt);
c = "#"+n+n+"0000";
str2 = str2 + "<font color='"+c+"'>" + sText.charAt(i) + "</font>";
}
return str2;
}
// --></script>
</head>
<body bgcolor="white" onload="setText1()">
<div id="outText" style="position:absolute;top:50px;left:5px;"></div>
</body>
</html>
No.1ベストアンサー
- 回答日時:
str2 = str2 + "<font color='"+c+"'>" + sText.charAt(i) + "</font>";
この行の<font color='"+c+"'>にsizeを足してください
例えば
<font size='20' color='"+c+"'>
の様にします。
sizeの数字は任意に変更可能です。
注意として、サイズはダブルコーテーションではなくシングルで囲うようにしてください
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
似たような質問が見つかりました
- JavaScript 画像の表示位置 3 2022/12/23 08:25
- JavaScript ソースコードのいじる場所が分かりません。 1 2022/12/23 02:06
- HTML・CSS html/cssで要素が出てこなくて困ってます 1 2022/12/31 16:59
- JavaScript jQueryでのドラッグアンドドロップについて 1 2022/07/07 21:04
- JavaScript jQueryでのドラッグアンドドロップについて 1 2022/07/30 09:10
- HTML・CSS cssが効かなくて困ってます 1 2023/01/01 23:57
- JavaScript vertical sliderをautoplayしたい 2 2022/08/25 14:47
- JavaScript HTMLでJavaScriptを使ってパスワードの強化判定のプログラムを作成しています。 一通り作っ 2 2022/10/19 01:41
- Excel(エクセル) PHPプログラムをエクセルに張り付けると検索ボックスがでてくる! 3 2022/05/08 07:10
- PHP PHPのエラーの解消法について教えて下さい。 1 2023/02/06 10:48
関連するカテゴリからQ&Aを探す
おすすめ情報
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
CSS <div>の入れ子が反映さ...
-
css固定したフッターが本文と重...
-
フッター上部に謎の隙間
-
ヘッダとフッタが固定でコンテ...
-
Flickity で画像にリンクを貼る...
-
オープニングにアニメーション...
-
フッターの下に隙間ができてしまう
-
【CSS】floatで左右に並べた...
-
大分類・中分類・小分類
-
【コーディング】途中から位置...
-
画像の特定の座標にカーソルが...
-
IE6のレイアウト崩れ
-
HTML CSS 文字化け
-
チェックボックスの背景色って...
-
html スクロール要素を下から表...
-
CSS 可変マージン
-
ワードプレスでレイアウトが崩...
-
スタイルシートで画面を上下に...
-
このタグはグラデーションです...
-
ラジオボタンで段階評価
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
フッター上部に謎の隙間
-
CSS <div>の入れ子が反映さ...
-
【CSS】floatで左右に並べた...
-
css固定したフッターが本文と重...
-
文字をクリックしたら別の文字...
-
textareaで入力した文字を改行...
-
オンマウス時に別画像を上に重...
-
スクロール可能なチェックボックス
-
文字を固定したいのですが…
-
1行で左寄せと右寄せと中央揃え...
-
Ctrl+F(検索)の窓を出したいの...
-
チェックボックスの背景色って...
-
Webサイト作成 プログレスバー ...
-
離れた場所にマウスオーバーで...
-
スタイルシートで画面を上下に...
-
メニューバーもスクロールに合...
-
ホームページのsidebar とconte...
-
CSSで背景を下までのばすには?
-
かなり困っています。知恵を貸...
-
TABLEの高さを固定したいのですが…
おすすめ情報