La etiqueta marquee es un elemento HTML no estándar que hace que el texto se desplace hacia arriba, hacia abajo, hacia la izquierda o hacia la derecha automáticamente. La etiqueta se introdujo por primera vez en las primeras versiones de Internet Explorer de Microsoft y se comparó con el elemento blink de Netscape como una extensión no estándar del estándar HTML con problemas de usabilidad. El W3C desaconseja su uso en documentos HTML.
La marquesina puede resultar una distracción. [1] El ojo humano se siente atraído por el movimiento, [2] y el texto de la marquesina se mueve constantemente.
Al igual que con el elemento blink , las imágenes o el texto etiquetados con marquee no siempre son completamente visibles en las páginas renderizadas, lo que hace que la impresión de dichas páginas sea una tarea ineficiente (si no imposible); normalmente se requieren varios intentos para capturar todo el texto que podría mostrarse donde los mensajes se desplazan o parpadean. La behavior="alternate"versión de marquee hace que el texto se mueva de un lado a otro, pero no oculta ninguna parte de él si los anchos de desplazamiento están configurados correctamente.
Debido a que el texto de la marquesina se mueve, los enlaces dentro de ella son más difíciles de hacer clic que en los del texto estático, dependiendo de la velocidad y la longitud del desplazamiento. Los usuarios solo tienen una oportunidad cada vez que se desplazan. Además, desplazarse demasiado rápido por el texto puede hacer que sea ilegible para algunas personas, en particular aquellas con discapacidades visuales. Esto puede frustrar fácilmente a los usuarios. Para combatir esto, la creación de scripts del lado del cliente permite programar las marquesinas para que se detengan cuando el mouse se encuentra sobre ellas.
A diferencia de su contraparte parpadeante, el elemento de marquesina tiene varios atributos que se pueden usar para controlar y ajustar la apariencia de la marquesina.
alignbehaviorLos bucles se cuentan por cada vez que alcanzan cada extremo de la marquesina; un bucle de 1 es diferente del atributo 'Deslizar'. cuando se desplaza un elemento con el atributo 'Deslizar', el elemento se detendrá permanentemente al final de la longitud de la marquesina, mostrando el elemento completo. Sin embargo, cuando se desplaza un elemento sin un atributo 'Bucle', la cantidad de desplazamientos se repetirá de acuerdo con el número al que 'Bucle' sea igual. Si 'Bucle=1', entonces el elemento se desplazará solo una vez y saldrá de la longitud de la marquesina por completo, mientras que el elemento que se desplaza se detendrá, lo que sería lo mismo que 'Deslizar'. De forma predeterminada, 'Bucle=infinito', por lo que no es necesario codificar el atributo 'Bucle' si desea un desplazamiento continuo. Nota: 'Bucle' se ignorará si se codifica el atributo 'Comportamiento'. Además, si 'Comportamiento=Alternativo' y 'Bucle=2', entonces el elemento irá desde el principio de la marquesina hasta el final y volverá al principio, contando un viaje de ida y vuelta como 2 bucles.
bgcolordirectiondirection=leftPor lo tanto, mueve el texto de derecha a izquierda en la pantalla.widthloopscrollamountscrolldelayUn elemento de marquesina puede contener HTML arbitrario, por lo que además de texto, podría mover una o más imágenes, clips de películas o GIF animados .
La etiqueta marquee ha quedado obsoleta en la mayoría de los navegadores, pero aún se puede implementar el mismo comportamiento con hojas de estilo en cascada , de esta manera:
@ marco de fotogramas clave { 0 % { transformar : translateX ( 100 % ); } 100 % { transformar : translateX ( -100 % ); }}. contenedor de marquesina { espacio en blanco : nowrap ; desbordamiento : oculto ; posición : relativa ; animación : marquesina 10 s lineal infinita ; }. contenido de marquesina { pantalla : bloque en línea ; }La animación, marquee, se define como @keyframesuna simple traslación de derecha a izquierda; sería posible invertir la animación invirtiéndola (de -100% a 100%, por ejemplo). 10sTambién se puede modificar para alterar su salida.
Luego se puede invocar el estilo en HTML:
< div class = "marquee-container" >< div class = "marquee-content" > ¡Los malditos gansos están en el contrato de arrendamiento! </ div ></ div >¡Los malditos gansos están en arrendamiento!
El elemento marquee fue inventado por primera vez para Internet Explorer de Microsoft y es compatible con él. Los navegadores web Firefox , Chrome y Safari lo admiten por compatibilidad con páginas heredadas. El elemento no es compatible con HTML . Se propusieron propiedades CSS para lograr el mismo efecto que se especifica en el módulo Marquee de nivel 3, que se abandonó sin implementación en 2014. [3] También se pueden lograr efectos similares mediante el uso de JavaScript , [4] o animaciones CSS3 . [5]