Yap creo que ya lo solucioné.
En el html esta mal posicionado las librerias
tieneResulta que ir primeropara que funcione todo necesitas que las librerías estén ordenadas de cierta manera el html tiene la libreriasgracias de css luegocargar desde arriba hacia abajo.
Primero tiene que ir el la libreria de jqueryjquery
, porque carga todas las funciones y despues la librerias js dedependencias que usa vegas y posteriormente tu, por lo tanto depues cargas vegas.min.js
para que funcione.
Depues usas el script o en este caso mi script en el html ya que cargue antes las funciones y propiedades de vegas en el archivo vegas.min.js
el css de vegas.min.css
puede ir antes ya que solo carga estilos nada mas.
espero que sirva esta explicación. Saludos.
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/vegas/2.4.0/vegas.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/vegas/2.4.0/vegas.js"></script>
<script>
$(document).ready(function() {
var imagecollection = [
{src: 'https://i.imgflip.com/fmohn.jpg'},
{src: 'https://i.imgflip.com/fmohn.jpg'},
{src: 'https://i.imgflip.com/fmohn.jpg'},
{src: 'https://i.imgflip.com/fmohn.jpg'}
/* Slideshow not working? Check your image links. */
];
$("#ShowSlideShowHere").vegas({
slides: imagecollection,
transition: 'fade',
preloadImage: true,
timer: true,
shuffle: true,
delay: 5000,
animation: 'kenburns',
cover: true
});
});
</script>
</head>
<body>
<div style="height:100vh">
<div id="ShowSlideShowHere" style="height:100vh">sadasdasdas</div>
</div>
</body>
</html>
funcionando.