Backstretch jQuery plugin doesn't work

1.3k Views Asked by At

I'd like to use the Backstretch jQuery plugin to create a fullscreen background picture on the starting page. Therefore I used the following code:

<div class="startslide">
<script>
$.backstretch('IMG_3628.jpg');
</script>
</div>




<footer class="footer">>
<script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery-backstretch/2.0.3/jquery.backstretch.min.js"></script>

</footer>

I don't really know what I did wrong as I did it the same way it is described in the demo....

I'd very much appreciate your help :)

2

There are 2 best solutions below

3
guvenckardas On BEST ANSWER
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
    <script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
    <script src="//cdnjs.cloudflare.com/ajax/libs/jquery-backstretch/2.0.3/jquery.backstretch.min.js"></script>




<div class="startslide">
    <script>
        $.backstretch(['IMG_3628.jpg']);
    </script>
</div>
0
w3sic3 On

You have to call jQuery plugin before calling those of Backtrech.

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery-backstretch/2.0.3/jquery.backstretch.min.js"></script>

Then, you have forget the []. Try that :

$.backstretch(['IMG_3628.jpg']);

Please find this JSFIDDLE