|
|
|
このタグについて
みなさんはマーキーをご存知でしょうか。ちょっと前までは頻繁に見かけましたが、最近ではマーキーを発展させたようなことをJavaScriptで処理するのが普通になってきました。
今でもたまに古き良きサイトでは見かけることがあります。Firefoxの普及に伴って、IEでしか表現できないマーキー効果は徐々に消えゆくことでしょう。
このセクションでは、そんな古き良きマーキーを後の世代に残そう（？）と、マーキーの基本から知ってるようで知らない応用技を書き綴りたいと思います。
まず、マーキーとはスクロールする文字列です。例えばこんな風に
コードは後でまとめて紹介しますので、ここではコードの各属性について紹介したいと思います。
direction
文字列が移動する方向を指定します。up, down, left, rightの4種類が指定できます。
このコードでは省略されていますが、省略された場合leftが適用されます。
behavior
画面の端まで文字列が来たときの処理を指定します。初期値はscrollで、一昔前の横スクロールのゲームみたく、画面の端に吸い込まれるように消えたかと思うと、反対側から出てきます。
ほかに画面端で動作が停止するslideと、両端を往復するalternateが指定できます。
scrollamount, scrolldelay
scrollamountでは1回の描画での移動間隔、scrolldelayでは描画の間隔をミリ秒で指定します（ややこしいですね）。この2つの属性でスクロールの「速さ」が決まります。
どちらの値も小さくすることで、自然な描写に近づきますが、その分スピードが落ちます。
また、scrolldelayでは60以下の値を指定すると60に丸められますが、truespeedという属性を指定することで正確な値が用いられます。
loop
スクロールを行う回数を指定します。
そのほか、width, heightなどでマーキーの有効範囲を操作できますが、ここでの解説は省略します。
基礎はこのくらいにして、応用編に行きたいと思います。マーキーは単独で使用してもそれなりの効果がありますが、マーキータグを２つ使うことで更に面白いことができます。
マーキータグを入れ子にすることで、サインカーブのような軌道をつくれます。本来は完全に別物とは言えない「左」と「上」が同時に指定できないため、入れ子にすることで実現しているのです。
ここでは小さくまとまっていますが、サンプルをコピーすると実際の挙動を確認できますのでそちらをご覧ください。
それと、サンプルは掲載できませんが、反対方向の2つのマーキーを終点で重ね合わせることで、文字に影が重なるアニメーションも実現しています。
関連
対応ブラウザ
WIN IE 4.0〜 NN -〜 MAC IE 4.0〜 NN -〜
ユーザ設定
上で散々喋ったので、特にもう話すことはありません。
 HTMLのTOPに戻る
TOPに戻る
|
