HTML マーキー テキストの速度を変更する
-
<marquee>タグのscrollamount属性を使用してテキストのスクロール速度を制御する -
<marquee>タグのscrolldelay属性を使用してテキストのスクロール速度を制御する
HTML では、<marquee> タグを使用して、移動またはスクロールするテキスト アニメーションを作成できます。 左から右、右から左、下から上、上から下の 4 方向にスクロールするテキストを作成し、速度を変更し、direction 属性の値を設定して方向を設定できます。 スクロールするテキスト。
この記事では、HTML の
<marquee> タグの scrollamount 属性を使用してテキストのスクロール速度を制御する
scrollamount 属性は、<marquee> タグのテキストのスクロール速度を設定します。 文字列形式の数値を取ります。
属性の値は、特定の時間間隔でスクロールするピクセル数を示します。 scrollamount 属性のデフォルト値は 6px です。
たとえば、さまざまな scrollamount 値を持つさまざまな <marquee> タグを作成しました。 出力では、ユーザーはさまざまな scrollamount でテキストの速度を観察できます。
scrollmount の値が大きいほど、テキストは速く移動します。
コード例:
<marquee behavior=scroll direction="left" scrollamount="2">scrollamount = 2</marquee>
<marquee behavior=scroll direction="left" scrollamount="6">scrollamount = 6</marquee>
<marquee behavior=scroll direction="right" scrollamount="10">scrollamount = 10</marquee>
<marquee behavior=scroll direction="right" scrollamount="15">scrollamount = 15</marquee>
出力：
上記の出力では、scrollamount および direction 属性の値に応じて、さまざまなテキストがさまざまな方向にさまざまな速度で移動していることがわかります。
<marquee> タグの scrolldelay 属性を使用してテキストのスクロール速度を制御する
scrolldelay 属性を使用して、各スクロールの時間間隔を設定できます。 文字列形式のミリ秒単位の値を受け入れます。
scrolldelay 属性のデフォルト値は 85 で、60 未満の値は受け入れません。この例では、scrolldelay 属性の値が異なる別の <marquee> タグを作成しました。
コード例:
<marquee behavior=scroll direction="left" scrolldelay="200">scrolldelay = 200ms</marquee>
<marquee behavior=scroll direction="right" scrolldelay="61">scrolldelay = 61ms</marquee>
<marquee behavior=scroll direction="left" scrolldelay="300">scrolldelay = 300ms</marquee>
<marquee behavior=scroll direction="right" scrolldelay="150">scrolldelay = 150ms</marquee>
出力：
上記の出力では、scrolldelay 属性の値が増加すると、各スクロールの間隔が長くなるにつれてテキストの移動が遅くなることがわかります。 scrolldelay および scrollamount 属性は、HTML5 で廃止されました。 そのため、一部の最新のブラウザーではサポートされていない可能性があります。
