MARQUESINA
La etiqueta <MARQUEE> se utiliza para hacer una animación sencilla de un texto o una imagen en movimiento:
<marquee "bgcolor="#CC6633" width="100%" height="45" scrolldelay="100" scrollamount="5" direction="down" loop="infinite">El texto en movimiento o etiqueta foto
</marquee>
BGCOLOR: Como ya esta explicado anteriormente es para poner el color de fondo, en este caso de la etiqueta <marquee>
SCROLLAMOUNT: Es el tiempo que tiene que pasar para cada cambio de posición, cuanto mayor sea el valor más tardara la marquesina en moverse.
SCROLLAMOUNT: Es la cantidad de pixels que tienen que desplazarse cada vez que se mueve, cuanto más valor mayor sera la velocidad de la animación.
DIRECTION: Hacia que dirección se quiere que valla la animación dentro de la marquesina (down, up).
LOOP: Por defecto se desplazara sin detenerse, INFINITE, pero se puede asignar un valor como "5", que esto quiere decir que se desplazara 5 veces y luego se detendrá.
<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="utf-8" />
<link href="http://vjs.zencdn.net/4.6/video-js.css" rel="stylesheet">
<script src="http://vjs.zencdn.net/4.6/video.js"></script>
<style type="text/css">
.vjs-default-skin { color: #CC0033; }
.vjs-default-skin .vjs-play-progress,
.vjs-default-skin .vjs-volume-level { background-color: FF3300 }
.vjs-default-skin .vjs-control-bar,
.vjs-default-skin .vjs-big-play-button { background: rgba(122,153,3,0.7) }
.vjs-default-skin .vjs-slider { background: rgba(122,153,3,0.2333333333333333) }
.vjs-default-skin .vjs-control-bar { font-size: 71% }
</style>
</head>
<body bgcolor="#0099FF">
<header>
<center>
<p><h1><b><u><h1><font color="CC0033"> PRIMARK</font></h1></b></u></h1></p>
<p><h1><b><font color="006600">¡¡ La vida es un festival !!</font></b></h1></p>
<marquee bgcolor="006600" width="80%" scrolldelay="5" behavior="alternate"><b>¡No te pierdas las últimas novedades</b>
<br />
<center><img src="C:\Users\ETC12\Desktop\mono\primark logo.jpg"></center>
</marquee>
</center>
<p></p>
</header>
<header>
<center>
<video id="MY_VIDEO_1" class="video-js vjs-default-skin" controls autoplay preload="auto" width="640" height="264" poster="MY_VIDEO_POSTER.jpg" data-setup="{}">
<source src="C:\Users\ETC12\Downloads\Presentación Campaña Primark.mp4" preload="auto" type='video/mp4'>
<p class="vjs-no-js">
</video>
</center>
<header>
<audio autoplay id="bgsound">
<source src="C:\Users\ETC12\Desktop\Bailando.mp3" type="audio/mp3">
</audio>
<script>
document.getElementById('bgsound').volume=0.2;
</script>
</header>
<br />
<center>
<img src="C:\Users\ETC12\Desktop\mono\mapa primark.jpg" usemap="#mapa de imágenes" alt="pincha">
<map name="mapa de imágenes">
<area shape="circle" coords="404,271,75" target="_blank" href="http://www.primark.com/es/novedades" alt="pagina primark">
<area shape="rect" coords="15,7,268,97" target="_blank" href="http://www.primark.com/es/customer-service/contact-us" alt="contactenos">
<area shape="poly" coords="377,5,268,181,475,172" href="mailto:nacifcd0110@gmail.com" alt="mail to">
</map>
</center>
</body>
</HTML>
No hay comentarios:
Publicar un comentario