Home » Tool＆Tips » 今さら marquee ＆ blink

今さら marquee ＆ blink

2015/04/02 2015/12/28

二大ウザいタグでお馴染み、W3C 非推奨の "marquee" と廃止された "blink" を今さら弄ります。

【marquee】デフォルト

デフォルトは右から左にスクロールを続けます。

<marquee>(～｀＝∇＝´)～…　デフォルト～</marquee>
<marquee direction="left">(～｀＝∇＝´)～…　右から左がデフォ～</marquee>
<marquee behavior="scroll">(～｀＝∇＝´)～…　延々スクロールがデフォ～</marquee>
(～｀＝∇＝´)～…　デフォルト～ (～｀＝∇＝´)～…　右から左がデフォ～ (～｀＝∇＝´)～…　延々スクロールがデフォ～

【marquee】左から右

<marquee direction="right">左から右～　…～(｀＝∇＝´～)</marquee>
左から右～　…～(｀＝∇＝´～)

【marquee】端で停止

<marquee behavior="slide">(～｀＝∇＝´)～…　端で～ピタッ</marquee>
(～｀＝∇＝´)～…　端で～ピタッ

【marquee】往復

<marquee behavior="alternate">(～｀＝∇＝´)～…　行ったり来たり　…～(｀＝∇＝´～)</marquee>
(～｀＝∇＝´)～…　行ったり来たり　…～(｀＝∇＝´～)

【marquee】下から上

<marquee direction="up" height="80">((＞(｀＝∇＝´)＜))　のぼり～↑</marquee>
((＞(｀＝∇＝´)＜))　のぼり～↑

【marquee】上から下

<marquee direction="down" height="80">((＞(｀＝∇＝´)＜))　くだり～↓</marquee>
((＞(｀＝∇＝´)＜))　くだり～↓

【marquee】上下左右を往復

<marquee behavior="alternate" direction="up" height="80"><marquee behavior="alternate">((＞(｀＝∇＝´)＜))</marquee></marquee>
((＞(｀＝∇＝´)＜))

【marquee】他の属性

"loop"(回数)、"scrolldelay"(時間の間隔)、"scrollamount"(進む距離) など。

※参考：marquee (html OR css) - Google 検索

【marquee】CSS3 で再現

※CSS が結構長いので省略。

【blink】marquee で再現

<marquee scrolldelay="300" scrollamount="350" width="350">(＼(｀◎∇◎´)／)　点滅ッ</marquee>
(＼(｀◎∇◎´)／)　点滅ッ

※Google Chromeで見ると横方向の高速移動になるようです。（2015.12.28 追記）

【blink】CSS3 で再現（2015.12.28 追記）

※やはり CSS が結構長いので省略。やはりネタですよねえ！

皆さん、何だかんだ言って…

…"marquee" も "blink" も大好きなんじゃないですか、やだー。

(｀ー∇ー´)φ　Kindle本、始めました。

河馬追物 [Kindle版] / 越智 夕恵

動物をモチーフにした短編集。5作品を収録。

『信濃の国は』移住した信州での日々。

『カッコウの呼ぶ声』近未来の男女に関する一考察。

『月のウサギ』今昔物語に拠る戯曲。

『登攀ガエル』ニホンアマガエルとの交流。

『河馬追物』都会の奇妙な追跡劇。

[Kindle価格]￥100.