marquee要素

Updated / Published

marquee要素は自動的に文字や画像を表示域内で行って帰ってとスクロールさせるマーキーを作成します。Internet Explorer 2.0 の時に独自に採用された機能で、テキストや画像などのインライン内容だけでなく、ブロックレベル要素までも marquee要素の内容に含めたものは何でもスクロールさせることができるようです。多くの属性が定義されており、スクロールの動きをいろいろとコントロールすることができます。

marquee要素は Internet Explorer 2.0 の時に独自に採用された機能ですが、現在では主要ブラウザとフィーチャーフォンの携帯電話端末のブラウザまで多くの UA が対応しており、属性にいたるまでほとんど全て対応しています。しかしながらHTML の正式な仕様には定義されていない要素であるため、現在はサポートしている UA であっても今後の対応がどのようになるかわかりません。blink要素のように今後サポートをやめるUAがでてきてもおかしくはありません。

独自機能のため仕様は不明ですが、表示域の左右いっぱいまでの範囲を占め、前後に改行を置くことから要素型を区分するならばブロックレベル要素扱いになるようです。なお、marquee要素の中に p要素div要素のブロックレベル要素を含めても、強制的にそのブロックボックスごとスクロールさせてしまい、ユーザ側ではそのスクロールを止めることができないので、数ある独自機能の中でも最凶クラスの機能をもちます。

バージョン
Internet Explorer の独自機能
要素型
独自機能のため不明(ブロックレベル要素か?)
開始タグ
必須
終了タグ
必須
非推奨
-
内容モデル
独自機能のため不明

behavior属性

バージョン
Internet Explorer の独自機能
指定要素
marquee
必須
-
非推奨
-
属性値
  • scroll
  • slide
  • alternate

マーキーのスクロールの動き方を指定します。値には次の3つのキーワードがあります。キーワードは半角アルファベットの大文字・小文字が区別されません(case-insensitive)。

scroll
一定方向にスクロールをくり返す
slide
指定した方向にスクロールし画面の端で止まる
alternate
画面の中で左右に行って帰ってをくり返す

bgcolor属性

バージョン
Internet Explorer の独自機能
指定要素
marquee
必須
-
非推奨
-
属性値

マーキーのスクロールする領域に16進数RGB値、またはカラーネームで背景色を指定します。CSSbackground-colorプロパティでも代替が可能です。

direction属性

バージョン
Internet Explorer の独自機能
指定要素
marquee
必須
-
非推奨
-
属性値
  • left
  • right
  • up
  • down

マーキーのスクロールさせる方向を指定します。値には次の4つのキーワードがあります。キーワードは半角アルファベットの大文字・小文字が区別されません(case-insensitive)。初期値は "left" です。

left
(右から)左に向かってスクロール
right
(左から)右に向かってスクロール
up
(下から)上に向かってスクロール
down
(上から)下に向かってスクロール

height属性

バージョン
Internet Explorer の独自機能
指定要素
marquee
必須
-
非推奨
-
属性値
  • 整数(pixels)
  • パーセンテージ値(%)

マーキーのスクロールする領域の高さを指定します。CSS の heightプロパティでも代替が可能です。

hspace属性

バージョン
Internet Explorer の独自機能
指定要素
marquee
必須
-
非推奨
-
属性値
整数(pixels)

マーキーがスクロールする範囲の周辺に設ける左右の余白を整数(ピクセル数で解釈)で指定します。CSS の marginプロパティでも代替が可能です。

loop属性

バージョン
Internet Explorer の独自機能
指定要素
marquee
必須
-
非推奨
-
属性値
  • 整数
  • infinite
  • -1

マーキーがスクロールする回数を指定する属性で、値には整数でスクロールを繰り返す回数を指定するか、"-1"、または "infinite" のキーワードを指定すると無限にスクロールを繰り返します。初期値は "-1" で、loop属性の指定がなければ、永遠にスクロールを繰り返します。

scrollamount属性

バージョン
Internet Explorer の独自機能
指定要素
marquee
必須
-
非推奨
-
属性値
整数(pixels)

一度に動かす移動距離間を整数(ピクセル数で解釈)で指定します。テキストや画像などの内容を一度に何ピクセル動かすかの設定です。値が大きいほどスクロール速度は速くなりますが、カクカクとした動きになります。多くのUAで初期値は "6" です。

scrolldelay属性

バージョン
Internet Explorer の独自機能
指定要素
marquee
必須
-
非推奨
-
属性値
整数(ミリ秒単位)

スクロールする内容の遅延時間をミリ秒(1/1000秒)単位の整数で指定し、数が小さいほど速くなり、数が大きいほど遅くなります。初期値は "85" です。"100" で100ミリ秒なので0.1秒おきに scrollamount属性で指定された距離を移動します。

Internet Explorer では scrolldelay属性の値が "60" 未満("1-59")の場合は、"1" でも "60" でも同じ0.06秒おきに指定の距離を移動します。"60" 未満の値を指定する場合には、truespeed属性の値に "true" を指定します。

truespeed属性

バージョン
Internet Explorer の独自機能
指定要素
marquee
必須
-
非推奨
-
属性値
  • true
  • false

Internet Explorer のみに有効な属性で、scrolldelay属性で指定した遅延時間に合わせて動作するかを指定します。値に "true" を指定すると、scrolldelay属性の値に合わせて正確に動きます。scrolldelay属性の値に "60" 未満の値を指定した場合に、正確な遅延時間を反映させることができます。

値に "false" を指定すると、scrolldelay属性の値に "60" 未満("1-59")の指定があっても60ミリ秒(0.06秒)おきに動作します。ただし、scrolldelay属性の値が "60" 以上であれば、0.06秒おきではなく、scrolldelay属性で指定された値が遅延時間として正確に機能します。Internet Explorer における truespeed属性の初期値は、"false" に設定されています。

vspace属性

バージョン
Internet Explorer の独自機能
指定要素
marquee
必須
-
非推奨
-
属性値
整数(pixels)

マーキーがスクロールする範囲の周辺に設ける上下の余白を整数(ピクセル数で解釈)で指定します。CSS の marginプロパティでも代替が可能です。

width属性

バージョン
Internet Explorer の独自機能
指定要素
marquee
必須
-
非推奨
-
属性値
  • 整数(pixels)
  • パーセンテージ値(%)

マーキーのスクロールする領域の横幅を指定します。CSS の widthプロパティでも代替が可能です。

その他の属性

marquee要素は仕様には定義されていないため、共通属性が使えるかどうかは UA に依ります。

共通属性

marquee要素のサンプル

マーキーは目を惹く効果ではありますが、読みやすさを確実に損ないます。

ユーザからしても迷惑に感じられることがほとんどであるため使用することはおすすめできません。

<marquee>デフォルトのマーキー</marquee>
<marquee direction="right">左から右へスクロール</marquee>
<marquee scrollamount="50">超高速スクロール</marquee>
<marquee scrolldelay="200">超低速スクロール</marquee>
<marquee behavior ="slide">画面の端で止まる</marquee>