4 ms·

Marquee HTML Element

35 points by zachsherman 7y ago

geofft 7y ago
In Safari, "This text will bounce" (two marquees in orthogonal directions, both with behavior="alternate") only moves left-to-right - it seems the inner marquee cancels the outer one. In Chrome it moves diagonally and bounces in both directions like an old-school screen saver. The article doesn't clarify whether this is intended behavior, should it?
- pcr910303 7y ago
  > In Safari, "This text will bounce" (two marquees in orthogonal directions, both with behavior="alternate") only moves left-to-right Well, not for me, at least. Currently using Safari 12.1. Maybe you're using the Catalina beta with a higher Safari version?
  - geofft 7y ago
    I'm on 12.1.2 on Mojave. Weird!
flixic 7y ago
Still works on iOS 13. It’s quite reassuring that after all the posturing about obsolescence and depreciations it’s still there.
- tantalor 7y ago
  Deprecation, not depreciation
  - nocman 7y ago
    Well, I guess one could make the argument that "<marquee>" isn't as valuable as it used to be. But, of course, you could also make the argument that it has the same low value that it always had. :-D Either way I'm sure "all the posturing" was actually about deprecation.
  - flixic 7y ago
    That’s what you get for absentmindedly trusting autocomplete suggestions.
qiqitori 7y ago
Used <marquee> just a couple weeks ago to simulate a scrolling text screensaver for use as a video backdrop. Actually used the linked page as a reference and laughed a bit at the "truespeed" attribute.
- keanebean86 7y ago
  I use it when testing for XSS. It shows me where the dirty text is being added to the page and it can be very amusing when nested.
  - ramigb 7y ago
    That's an interesting use indeed, do you have any examples?
mkoryak 7y ago
I recently used some marque elements for taking up space. One thing I really liked about them was the 'truespeed' attribute. I mean, name a cool sounding attribute that you use every day.. you can't.
dandigangi 7y ago
One of those legacy features you always get a kick out of looking back. I could see some cases where you could use that still though!
yyyk 7y ago
There isn't a good argument for considering marquee deprecated anymore. Not when a <toast> element is being considered[0]. So I'd use it whenever I want a marquee. After all, <marquee> and <toast> are both shorthands for stuff that could be implemented in CSS/JS - except marquee is well supported, well specified, and more semantically different than other elements compared to <toast> (which is pretty similar to <dialog> and arguably <output>[1]). [0] https://github.com/jackbsteinberg/std-toast https://github.com/jackbsteinberg/std-toast [1] https://www.scottohara.me/blog/2019/07/10/the-output-element.html https://www.scottohara.me/blog/2019/07/10/the-output-element...
- crazygringo 7y ago
  Except that I haven't seen a marquee used on a web page anywhere in years. Except in incredibly specific contexts (like a long title in a music player app), it's generally considered bad UX design. Whereas toasts are everywhere, a common, useful, established and recommended UX design pattern. So it's a genuine convenience to developers for browsers to provide it, in the same way browsers provide buttons, combo boxes, and date pickers. (Even though all of those also can be, and sometimes are, implemented in JS.) The "good argument" to me boils down to use and convenience, and removing cruft.
  - yyyk 7y ago
    Well, a marquee (not necessarily the HTML element per se but the design element) is often used on news sites/forums, at least amongst those I visit currently - it's used there as a news ticker. I could go on and argue that it's far more common than a toast (which I barely see at all. Than again I don't like PWAs and try to avoid browsing from mobile when I can). But the sites I visit are not remotely representative at all, so I could well be wrong. I guess the sites you visit are also not remotely representative. IMHO, The fact that <marquee> was added and supported for so long (despite 'deprecation') is the best indication there's some demand for it, a better indicator than our browsing habits. Marquee is definitely more distinctive than <toast> is from other elements and better supported. So IMHO there's a much better case for including it compared to <toast>. P.S. The browser provided date pickers are so poorly designed and inconsistent I wish they didn't provide them at all. It's something I always override when I have time to do it.
zachsherman 7y ago
For all the haters out there I'm replacing every text tag on with this from here on out
vnglst 7y ago
Fun fact: it works for everything inside a <marquee> tag, you can do this for your entire website in one go!
Sniffnoy 7y ago
I remember when <marquee> was considered something like IE's answer to the <blink> tag. I'd like to see an article about the origin of the <marquee> tag, much like that one about the origin of the <blink>tag[0] that you see going around now and then. [0]http://www.montulli.org/theoriginofthe%3Cblink%3Etag http://www.montulli.org/theoriginofthe%3Cblink%3Etag
- tschwimmer 7y ago
  Interestingly, it seems the blink tag is now totally unsupported in modern browsers, whereas marquee seems to generally work.
kfalencik 7y ago
DVD screensaver bounce using two marquee elements. https://codepen.io/kfalencik/pen/bXYMbr https://codepen.io/kfalencik/pen/bXYMbr

35 points by zachsherman 7y ago

In Safari, "This text will bounce" (two marquees in orthogonal directions, both with behavior="alternate") only moves left-to-right - it seems the inner marquee cancels the outer one. In Chrome it moves diagonally and bounces in both directions like an old-school screen saver. The article doesn't clarify whether this is intended behavior, should it?

pcr910303 7y ago
> In Safari, "This text will bounce" (two marquees in orthogonal directions, both with behavior="alternate") only moves left-to-right Well, not for me, at least. Currently using Safari 12.1. Maybe you're using the Catalina beta with a higher Safari version?
- geofft 7y ago
  I'm on 12.1.2 on Mojave. Weird!

flixic 7y ago

Still works on iOS 13. It’s quite reassuring that after all the posturing about obsolescence and depreciations it’s still there.

tantalor 7y ago
Deprecation, not depreciation
- nocman 7y ago
  Well, I guess one could make the argument that "<marquee>" isn't as valuable as it used to be. But, of course, you could also make the argument that it has the same low value that it always had. :-D Either way I'm sure "all the posturing" was actually about deprecation.
- flixic 7y ago
  That’s what you get for absentmindedly trusting autocomplete suggestions.

qiqitori 7y ago

Used <marquee> just a couple weeks ago to simulate a scrolling text screensaver for use as a video backdrop. Actually used the linked page as a reference and laughed a bit at the "truespeed" attribute.

keanebean86 7y ago
I use it when testing for XSS. It shows me where the dirty text is being added to the page and it can be very amusing when nested.
- ramigb 7y ago
  That's an interesting use indeed, do you have any examples?

mkoryak 7y ago

I recently used some marque elements for taking up space. One thing I really liked about them was the 'truespeed' attribute. I mean, name a cool sounding attribute that you use every day.. you can't.

dandigangi 7y ago

One of those legacy features you always get a kick out of looking back. I could see some cases where you could use that still though!

yyyk 7y ago

There isn't a good argument for considering marquee deprecated anymore. Not when a <toast> element is being considered[0]. So I'd use it whenever I want a marquee. After all, <marquee> and <toast> are both shorthands for stuff that could be implemented in CSS/JS - except marquee is well supported, well specified, and more semantically different than other elements compared to <toast> (which is pretty similar to <dialog> and arguably <output>[1]). [0] https://github.com/jackbsteinberg/std-toast https://github.com/jackbsteinberg/std-toast [1] https://www.scottohara.me/blog/2019/07/10/the-output-element.html https://www.scottohara.me/blog/2019/07/10/the-output-element...

crazygringo 7y ago
Except that I haven't seen a marquee used on a web page anywhere in years. Except in incredibly specific contexts (like a long title in a music player app), it's generally considered bad UX design. Whereas toasts are everywhere, a common, useful, established and recommended UX design pattern. So it's a genuine convenience to developers for browsers to provide it, in the same way browsers provide buttons, combo boxes, and date pickers. (Even though all of those also can be, and sometimes are, implemented in JS.) The "good argument" to me boils down to use and convenience, and removing cruft.
- yyyk 7y ago
  Well, a marquee (not necessarily the HTML element per se but the design element) is often used on news sites/forums, at least amongst those I visit currently - it's used there as a news ticker. I could go on and argue that it's far more common than a toast (which I barely see at all. Than again I don't like PWAs and try to avoid browsing from mobile when I can). But the sites I visit are not remotely representative at all, so I could well be wrong. I guess the sites you visit are also not remotely representative. IMHO, The fact that <marquee> was added and supported for so long (despite 'deprecation') is the best indication there's some demand for it, a better indicator than our browsing habits. Marquee is definitely more distinctive than <toast> is from other elements and better supported. So IMHO there's a much better case for including it compared to <toast>. P.S. The browser provided date pickers are so poorly designed and inconsistent I wish they didn't provide them at all. It's something I always override when I have time to do it.

zachsherman 7y ago

For all the haters out there I'm replacing every text tag on with this from here on out

vnglst 7y ago

Fun fact: it works for everything inside a <marquee> tag, you can do this for your entire website in one go!

Sniffnoy 7y ago

I remember when <marquee> was considered something like IE's answer to the <blink> tag. I'd like to see an article about the origin of the <marquee> tag, much like that one about the origin of the <blink>tag[0] that you see going around now and then. [0]http://www.montulli.org/theoriginofthe%3Cblink%3Etag http://www.montulli.org/theoriginofthe%3Cblink%3Etag

tschwimmer 7y ago
Interestingly, it seems the blink tag is now totally unsupported in modern browsers, whereas marquee seems to generally work.

kfalencik 7y ago

DVD screensaver bounce using two marquee elements. https://codepen.io/kfalencik/pen/bXYMbr https://codepen.io/kfalencik/pen/bXYMbr