| ポイント |
<![CDATA[
y -= 2;
document.all["lay"].style.top = y;
if (y > 0) setTimeout('rollText()',100);
<div id="lay" style="position:absolute;top:200px;">
]]>
|
| 説 明 |
ページ上に文字を表示しスクロールさせるには、あらかじめdivタグで表示する文字列を囲んでおきます。この時にスタイルシートで座標を指定します。文字はウィンドウの下から表示するためウィンドウの高さを求める必要があり「document.body.clientHeight」で取得できます。「document.all["lay"].style.y」で表示するY座標を指定します。表示する文字の座標を減算しsetTimeout()を使って定期的に処理することで移動処理を行います。 |
| サンプル |
<![CDATA[
<html>
<head>
<title>文字をページ上にスクロール表示させる【IE】</title>
<script Language="JavaScript"><!--
function rollText()
{
y -= 2;
document.all["lay"].style.top = y;
if (y > 0) setTimeout('rollText()',100);
}
function init()
{
y = document.body.clientHeight;
setTimeout('rollText()',100);
}
// --></script>
</head>
<body onLoad="init()">
<div id="lay" style="position:absolute;top:200px;">
このサンプルはJavaScript例文辞典のものです。<br>
文字をスクロールさせるには、いろいろな方法があります。<br>
ページ上で自由に移動させるためにはスタイルシートと組み合わせて処理を行います。<br>
</div>
</body>
</html>
]]>
|
| 補足説明 |
なし |
|
■サンプルスクリプトを実行する >>実行
■各ブラウザでの動作結果を見る >>View!
|
文字をページ上にスクロール表示させる【IE】