Elemento de marquesina

La etiqueta de marquesina es un elemento HTML no estándar que hace que el texto se desplace hacia arriba, abajo, izquierda o 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 patentada no estándar del estándar HTML con problemas de usabilidad. El W3C desaconseja su uso en documentos HTML.

Problemas de usabilidad

La marquesina puede distraer. El ojo humano se siente atraído por el movimiento y el texto de marquesina se mueve constantemente.

Al igual que con el elemento parpadeante, las imágenes o el texto etiquetados con marquesinas no siempre son completamente visibles en las páginas renderizadas, lo que hace que imprimir dichas páginas sea una tarea ineficiente (si no imposible); normalmente se requieren varios intentos para capturar todo el texto que podría mostrarse cuando los mensajes se desplazan o parpadean. La versión behavior="alternate" del marco hace que el texto se mueva hacia adelante y hacia atrás, pero no oculta ninguna parte si los anchos de desplazamiento se configuran correctamente.

Debido a que el texto de marquesina se mueve, es más difícil hacer clic en los enlaces que contiene que en los de texto estático, dependiendo de la velocidad y la duración del desplazamiento. Los usuarios solo tienen una oportunidad cada vez que pasa. Además, desplazar el texto demasiado rápido puede hacerlo ilegible para algunas personas, especialmente aquellas con discapacidad visual. Esto puede frustrar fácilmente a los usuarios. Para combatir esto, las secuencias de comandos del lado del cliente permiten programar las marquesinas para que se detengan cuando el mouse está sobre ellas.

Atributos

A diferencia de su contraparte parpadeante, el elemento de marquesina tiene varios atributos que se pueden utilizar para controlar y ajustar la apariencia de la marquesina.

Align

Usa la misma sintaxis que el elemento img.

Comportamiento

Permite al usuario establecer el comportamiento de la marquea a uno de tres tipos diferentes:

• Scroll (default) – Desplaza el texto de derecha a izquierda, y descansa en el lado derecho de la marquea cuando ha llegado al lado izquierdo. El texto desaparece cuando termina el bucle.
• Slide – Cuando se utiliza en ausencia del atributo 'Comportamiento', el contenido que debe ser desplazado deslizará toda la longitud de la marquea pero para el momento en que golpea el final, de modo que el contenido se mostrará. Pero si se utiliza con atributo 'Comportamiento' entonces el atributo 'Slide' será ignorado.

Los bucles se cuentan cada vez que llegan a cada extremo de la marquesina; un bucle de 1 es diferente de 'Slide' atributo. cuando el elemento se desplaza con 'Deslizar' atributo, el elemento se detendrá permanentemente al final de la marquesina, mostrando el elemento completo. Sin embargo, cuando se desplaza un elemento sin un 'Bucle' atributo, el número de pergaminos se repetirá según el número de 'Bucle' es igual a. Si 'Bucle=1' luego, el elemento se desplazará solo una vez y saldrá completamente de la longitud del marco, mientras que el elemento que se está desplazando se detendrá y será lo mismo que "Deslizar". De forma predeterminada, 'Loop=infinite' por lo que no es necesario codificar el atributo 'Bucle' si quieres un desplazamiento sin parar. Nota: 'Bucle' se ignorará si el atributo 'Comportamiento' está codificado. Además, si 'Comportamiento=Alternativo' y 'Bucle=2' luego, 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.

• Suplente- Retrocede el texto de derecha a izquierda.

Bgcolor

Establece el color de fondo de la marquea.

Dirección

Establece la dirección de la caja de la marquea. Los valores son dejados, derecho, arriba, abajo donde el valor indica la dirección del viaje. Direction=left por lo tanto mueve el texto de derecha a izquierda en la pantalla.

Width

Esto establece la amplitud de la marquea.

Loop

Esto establece cuántas veces la marquea debe 'Loop' su texto. Cada viaje cuenta como un bucle.

Scrollamount

Esto es cuántos píxeles el texto se mueve entre 'frames'. Así que desplazamiento=1 da la velocidad de desplazamiento más lenta.

Scrolldelay

Esto establece la cantidad de tiempo, en milisegundos, entre 'frames', mucho como ver una repetición de un video donde cada fotograma del video sería pausado para x número de milisegundos. 'Scrolldelay=1000' significa un movimiento lento donde cada marco dura mil mil mil milisegundos o un segundo.

Un elemento de marquesina puede contener HTML arbitrario, por lo que, además del texto, podría mover una o más imágenes, clips de película o GIF animados.

Implementación

La etiqueta de marquesina 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, como esta:

@claves marquee {} 0% {} transformación: traducirX()100%); } 100% {} transformación: traducirX()-100%); }}.marquee-container {} espacio blanco: ahora mismo; desbordamiento: escondido; posición: relativo; animación: marquee 10s lineal infinito;}.marquee-content {} pantalla: inline-block;}

La animación, marquee, se define por su @keyframes como una traducción simple de derecha a izquierda; sería posible invertir la animación invirtiéndola (de -100% a 100%, por ejemplo). El 10s también se puede modificar para alterar su salida.

El estilo luego se puede invocar en HTML:

c)div clase="marquee-container"■ c)div clase="marquee-content"■¡Los malditos gansos están en el contrato!.div"div■

Cumplimiento

El elemento marquesina se inventó 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 es HTML no compatible. Se propusieron propiedades CSS para lograr el mismo efecto especificado en el módulo Marquee Nivel 3, que se abandonó sin implementación en 2014. También se pueden lograr efectos similares mediante el uso de animaciones JavaScript o CSS3.