・marqueeに付けることができる属性

属性の種類	説明	指定できる値
width,height	横幅、縦幅を決める属性です。	ピクセル指定、％指定
hspace,vspace	横の余白、縦の余白を決める属性です。	ピクセル指定
bgcolor	背景色を設定する属性です。	#RRGGBB,色の名前
direction	動きの方向に関する属性です。	left：右から左へのスクロール（デフォルト） right：左から右へのスクロール up：下から上へのスクロール down：上から下へのスクロール
behavior	スクロール方法に関する属性です。	scroll：端まで行くともう片方の端から現れる普通のスクロール（デフォルト） alternate：端まで行くと折り返す往復運動 slide：片端から現れてもう片方の端まで行くと停止
loop	スクロール回数を設定する属性です。	数字でスクロール回数指定 -1：無限に繰り返し（デフォルト）
scrolldelay	描画時間間隔を指定する属性です。	1000分の1秒単位（85がデフォルト）
scrollamount	描画時間間隔でのスクロール距離を指定する属性です。	ピクセル指定（6がデフォルト）

２つのmarqueeでの動き

上の例は、下のようなタグの構造になっています。

＜marquee bgcolor="#f0f0ff" width="500"＞ ＜marquee bgcolor="#fff0f0" width="200"＞ ２つのmarqueeでの動き ＜/marquee＞ ＜/marquee＞

上のように、marqueeは入れ子構造にすることで、
スクロール移動する中にさらにスクロール移動する物を入れる事できます。

このコンテンツではこれを応用した、
marqueeのいろいろな動きの例を紹介していこうと思います。

１、斜めmarquee

斜め

タグは下のようになっています。

＜marquee bgcolor="#f0f0ff" width="200"＞ ＜marquee bgcolor="#f0f0ff" height="120" width="40" direction="down"＞ 斜め ＜/marquee＞ ＜/marquee＞

この例では、左にスクロールしていくmarqueeと、
下にスクロールするmarqueeを同時に組み合わせています。
タグの構造は、左方向スクロールmarqueeの中に、
下スクロールmarqueeが入っている、と言う構造になっていますが、
中に入っているmarqueeの方には、widthで幅の指定をしてやらないと、
少々動きに支障が出るようです。（左から消えた後すぐ右から出てきません）
指定する幅は、スクロールさせたい文字が入りきるぐらが最も良いでしょう。

２、変速marquee

変速

タグは下のようになっています。

＜marquee bgcolor="#f0f0ff" width="500"＞ ＜marquee bgcolor="#f0f0ff" width="50" behavior="alternate" scrollamount="3"＞ 波〜 ＜/marquee＞ ＜/marquee＞

この例では、横にスクロールしていく横幅500のmarqueeの中で、
横に往復する横幅50のmarqueeを動かしています。
この時、外側のmarqueeと内側のmarqueeのscrollamountの値を
いろいろ変えると、微妙に動き方が変わってきます。

「外＞内」：横方向に速度を変えながら移動していく運動 「外＝内」：止まって動いてを繰り返す運動 「外＜内」：行ったり来たりしながら進んでいく運動

サンプルは外側はscrollamount="6"（デフォルトで無指定の状態）、
内側はscrollamount="3"になっています。
また、上手くきれいな動きを取ってくれない時は、
scrollamountだけでなく、widthの幅指定も調節すると上手くいきます。

３、marquee波型運動

波〜

タグは下のようになっています。

＜marquee bgcolor="#f0f0ff" width="500"＞ ＜marquee bgcolor="#f0f0ff" height="50" width="40" direction="up" behavior="alternate"＞ 波〜 ＜/marquee＞ ＜/marquee＞

この例では、横にスクロールしていくmarqueeの中で、
上下に往復するmarqueeを動かしています。
この例でも１の斜め運動と同様な理由で、
中に入る方のmarqueeにwidth指定がしてあります。
ちなみにこの例は、↓こんな風に”・”で応用しても面白いかもしれません。
・

４、擬似ランダム運動

ランダム

marqueeにはランダムに運動させる命令はありません。
しかし、上で紹介した例を組み合わせて、
下のように無理矢理複雑な入れ子構造を作ってやると、
見た目はランダムな運動を取らせる事ができます。
あくまで見た目だけで実際は規則性を持っているため、
擬似的なものではあるのですが。

＜marquee bgcolor="#f0f0ff" width="270" scrollamount="4" behavior="alternate"＞ ＜marquee bgcolor="#f0f0ff" width="150" scrollamount="3" behavior="alternate"＞ ＜marquee bgcolor="#f0f0ff" width="110" scrollamount="2" behavior="alternate"＞ ＜marquee bgcolor="#f0f0ff" height="180" scrollamount="3" width="50" direction="up" behavior="alternate"＞ ＜marquee bgcolor="#f0f0ff" height="130" scrollamount="4" width="50" direction="up" behavior="alternate"＞ ＜marquee bgcolor="#f0f0ff" height="70" scrollamount="2" width="50" direction="up" behavior="alternate"＞ ランダム ＜/marquee＞ ＜/marquee＞ ＜/marquee＞ ＜/marquee＞ ＜/marquee＞ ＜/marquee＞

---

有明さんより、marqueeを使って2種類の文字の動きを組み合わせる、
と言う例を紹介して頂きました。
（こちらで上手く動作確認が取れなかったので、少しだけタグを改変させて頂きました。）

・決してボールが落ちないブロック崩し

(ver.1)
●
￣￣￣￣

＜marquee bgcolor="#f0f0ff" width="300" behavior="alternate" scrollamount="11"＞ ＜marquee bgcolor="#f0f0ff" width="16" height="270"direction="up" behavior="alternate" scrollamount="4"＞ ● ＜/marquee＞ ＜/marquee＞ ＜BR＞ ＜marquee bgcolor="#f0f0ff" width="300" behavior="alternate" scrollamount="12"＞ ￣￣￣￣ ＜/marquee＞

(ver.2)
●
￣￣￣￣

＜marquee bgcolor="#f0f0ff" width="300" behavior="alternate" scrollamount="11"＞ ＜marquee bgcolor="#f0f0ff" width="16" height="270"direction="up" behavior="alternate" scrollamount="4"＞ ● ＜/marquee＞ ＜BR＞ ＜marquee bgcolor="#f0f0ff" width="100" behavior="alternate" scrollamount="12"＞ ￣￣￣￣ ＜/marquee＞ ＜/marquee＞

このように、二種類の文字の動きを組み合わせる事で、
一つの文字を動かす時とはまた違った新しい物を作ることが出来ます。

有明さん紹介ありがとうございました。

---

…他にも何か面白いパターンを見つけたときや、
誰かの紹介を頂けた場合はどんどん追加していくつもりです。