Bootstrap Carousel, show 4, advance 1 - only showing 1 thumbnail not 4

Question

Im trying to implement a bootstrap thumbnail slider, there should be 4 tiles showing and with a click of the arrow it advances by 1 thumbnail. There are lots of examples of these available online however after trying to implement about 5 of them, I have the same problem with them all.

For some reason the slider only shows a single thumbnail when I copy all code and run it myself, I am used to using bootstrap normally can sort little issues, however this is just not making any sense to me.

This is the example I have implemented on my own private site, : http://www.bootply.com/94452

Here is a screen shot of how it looks for me :

Here is an entire cut off all code used on the example :

pastebin.mozilla.org/8972187

All code is exactly the same, however it just does not work, if anything else if needed from me to help resolve this, please let me know.

Thankyou very much for any help

Answer 1

There are a few problems with the code..

1. jQuery 1.7.1 is very old, use 1.9.1 or later.
2. You've included bootstrap.js and jquery.js twice, and they should only be included once

http://www.codeply.com/go/60oCFBwyPk