I have been struggling with this for a couple of days now so I thought that I would post it here. I have been experimenting with some jQuery plugins, and have had a go at using unslider.js
The problem that I am having is that the image will not span the full width of the page. It is a 1400 x 400 image. However, there is always a gap to the left, and top of the image. I am not sure if this is a CSS problem, or a JS problem, so I thought I would post it here.
I have made a codepen, although the images are hosted locally, so you will not be able to see the problem rendered. If you know a way round this, let me know!