Carrusel de Imágenes con titulo y Redirección
Aquí traigo un carrusel para colocar imágenes en movimiento tanto para arriba ,hacia abajo, derecha y hacia la izquierda además las podéis redirigir y colocar un titulo a cada imagen.
El código que os dejo van incluidas cinco imágenes pero podéis colocar las que queráis en el ejemplo tenéis diez imágenes las tenéis que colocar antes del cierre: </a></marquee></center>.
Además podéis configurar color del fondo velocidad etc.Lo podéis colocar en una entrada o en un Widget en la barra lateral es un widget muy fácil de implementar pero como veréis laborioso como todos los carruseles de imagen y texto
donde tienes que colocar URL de la imagen y las de la dirección donde van redirigidas, bueno vamos al lío que hay curro que hacer.
<center> <marquee direction="up" scrollamount="2" style="background-color: #642EFE; text-align: center; width:150px;height:150px;border:2px solid #cccccc;padding:3px" onmouseover="this.scrollAmount='0'"onmouseout="this.scrollAmount='1'">
<a href="PRIMER ENLACE" title="texto"><img src="URL DE TU PRIMERA IMAGEN" alt="" /></a><br />
<a href="SEGUNDO ENLACE" title="texto"><img src="URL DE TU SEGUNDA IMAGEN" alt="" /></a><br />
<a href="TERCERA ENLACE" title="texto"><img src="URL DE TU TERCERA IMAGEN" alt="" /></a><br />
<a href="CUARTAENLACE" title="texto"><img src="URL DE TU CUARTA IMAGEN" alt="" /></a><br />
<a href="QUINTA ENLACE" title="texto"><img src="URL DE TU QUINTA IMAGEN" alt="" /></a><br /></a></marquee></center>
<a href="PRIMER ENLACE" title="texto"><img src="URL DE TU PRIMERA IMAGEN" alt="" /></a><br />
<a href="SEGUNDO ENLACE" title="texto"><img src="URL DE TU SEGUNDA IMAGEN" alt="" /></a><br />
<a href="TERCERA ENLACE" title="texto"><img src="URL DE TU TERCERA IMAGEN" alt="" /></a><br />
<a href="CUARTAENLACE" title="texto"><img src="URL DE TU CUARTA IMAGEN" alt="" /></a><br />
<a href="QUINTA ENLACE" title="texto"><img src="URL DE TU QUINTA IMAGEN" alt="" /></a><br /></a></marquee></center>
Configuración:
Donde pone: marquee direction="up" podeís cambiar "up" hacia arriba, "down" hacia abajo, "left" de derecha a izquierda, "right" de izquierda a derecha .
Donde pone: scrollamount="2" es la velocidad de las imagenes cundo mas alta sea mas deprisa va
Donde pone: background-color: #642EFE el color del Fondo del Carrusel busca en el codigo de coloes el que mas te guste y lo cambias
Aquí pones el Titulo o el nombre que tu quieras: title="texto">
Donde pone:width:150px;height:150px Aquí colocas las medidas de las imagenes del Carrusel recuerda: width: ancho de tu imagen: height: alto de tu imagen
Si quieres cambiar el color y un borde mas ancho tienes que cambiar el valor de: border:2px solid #cccccc;
Aquí coloca la URL de donde quires que te dedirija cuando den click: href="PRIMER ENLACE"
Aquí La URL de la Imagen: src="URL DE TU PRIMERA IMAGEN"
Aquí elexto que quieres que vean:title="texto"
Fecha:21/04/2018
Publicado por:
