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属性
マーキーのスクロールする領域に16進数RGB値、またはカラーネームで背景色を指定します。CSS の background-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>