I downloaded a jQuery slider from http://basic-slider.com/ and I've put it onto my website. It works completely fine, except for when it's viewed in Internet Explorer 7. I've spent the past 3 days looking at this, but can't for the life in me find a solution. I was having the exact same problem in IE9, but I used the following and fixed it:
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE8" >
This is what it looks like in every browser but IE7.
http://www.hackathonplymouth.org/normal.png
This is what it looks like in IE7
http://www.hackathonplymouth.org/ie7.png
I did some research and apparently it might have something to do with position: relative; but I've completely removed/re-added this position just to test to see if that was the problem; no luck.
This is what it looks like in IE7 (The UL holding the LI's (Text captions) does not show). It's asif there's a css applied to stop the UL's from showing - but there's not.
Live preview: http://www.hackathonplymouth.org/slider/
Source code: http://www.hackathonplymouth.org/slider.zip - (Just incase someone would like a closer look)
In terms of code: I've had to link the source code as the jQuery has a fair few lines of code.
Has anyone else come across this when using a slider/jQuery within IE7?
Any input is greatly appreciated.
I was able to get it working by adding left: 0;
to the bjqs-caption
class. The text was just way off to the right because nothing it telling it where to position left and right, only bottom.