I can not get the jQuery Vegas plugin to work

1

I'm trying to try a plugin jQuery called vegas to make a fullscreen background but it's not working, I've done according to what's on the site, I've imported all libraries, jQuery and .css files % of Vegas . My code looks like this:

<!doctype html>
<html>
<head>

    <meta charset="utf-8">
    <meta name="description" content="">

    <title>Untitled</title>

    <link rel="stylesheet" href="style.css">
    <link rel="stylesheet" href="js/vegas/vegas.css">
    <link rel="stylesheet" href="css/reset.css">

    <script src="js/vegas/vegas.js"></script>       
    <script src="js/jquery.min.js"></script>

</head>
<body>

    <script type="text/javascript">

        $('body').vegas({
            slides: [
            { src: 'img/slide1.jpg' },
            { src: 'img/slide2.jpg' },
            { src: 'img/slide3.jpg' },
            { src: 'img/slide4.jpg' },
            { src: 'img/slide5.jpg' }
            ]
            });

        </script>

    </body>
    </html>

CSS body code:

body{

    font-family: 'Open Sans', sans-serif;
    font-size: 14px;
    font-size: 1.4rem;
    color: #292929;
    background: #000;
}

And the location of the image is correct and linked in the function of the plugin.

    
asked by anonymous 06.06.2015 / 15:40

1 answer

2

Use $.ready or $(function() {...}) , something like:

<script type="text/javascript">
$(function() {
    $('body').vegas({
        slides: [
        { src: 'img/slide1.jpg' },
        { src: 'img/slide2.jpg' },
        { src: 'img/slide3.jpg' },
        { src: 'img/slide4.jpg' },
        { src: 'img/slide5.jpg' }
        ]
    });
});
</script>

Example working:

$(function() {
    $('body').vegas({
        slides: [
                { src: 'http://vegas.jaysalvat.com/demo/img/poster-ja.jpg' },
                { src: 'http://vegas.jaysalvat.com/demo/img/poster-mr.jpg' },
                { src: 'http://vegas.jaysalvat.com/demo/img/poster-jb.jpg' },
                { src: 'http://vegas.jaysalvat.com/demo/img/poster-jg.jpg' },
                { src: 'http://vegas.jaysalvat.com/demo/img/poster-eg.jpg' },
                { src: 'http://vegas.jaysalvat.com/demo/img/poster-bw.jpg' },
                { src: 'http://vegas.jaysalvat.com/demo/img/poster-rd.jpg' },
                { src: 'http://vegas.jaysalvat.com/demo/img/poster-pb.jpg' },
                { src: 'http://vegas.jaysalvat.com/demo/img/poster-rl.jpg' },
                { src: 'http://vegas.jaysalvat.com/demo/img/poster-dh.jpg' }
        ]
    });
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script><scriptsrc="http://jaysalvat.github.io/vegas/releases/latest/vegas.min.js"></script>
<link href="http://jaysalvat.github.io/vegas/releases/latest/vegas.min.css" rel="stylesheet"/>
    
06.06.2015 / 16:08