I'm trying to use bxSlider, and IE8 won't seem to cooperate. In this example, the image slider is either collapsed or doesn't show up at all... it's hard to tell because when I turn on Developer Tools to debug, the slider suddenly shows up and all seems hunky dory.
There was another similar question in which there was a javascript error (in a different slideshow plugin) that was resolved by turning on the debugging console:
jQuery script only working under ie8/9 developer tools
...but IE doesn't seem to be throwing any errors in my case, and the fixes suggested didn't work for/apply to my situation. Plus I don't think I have a console.log anywhere in my scripts. I've tried adding any number of scripts that activate a console when the page loads, to no avail.
I tried a fix aimed at resolving JQuery conflicts (suggested at another site that I don't yet have rep enough to link to), altering the bxSlider function call like so:
<script>// <![CDATA[
$jQ = jQuery.noConflict();
$jQ('#home').live('pageshow',function(){
$jQ('.bxslider').bxSlider({
mode: 'fade',
auto: true,
pager: false,
controls:true,
pause: 9000,
});
});
// ]]>
</script>
No good, and started causing whole other conflicts.
In an issue on GitHub (https://github.com/wandoledzep/bxslider-4/issues/197), it was stated that IE was collapsing LIs in bxSlider, and suggested adding some CSS to give the LIs a width. This also did not work for me.
So right now I'm exactly nowhere on this issue after several hours. Any suggestions, Doctors?
Funny I ran into the same issue this evening - in my scenario I was able to set a fixed height on the bx-wrapper so....
.bx-wrapper{
height: 500px !important;
}
fixed it for me - not ideal because I expect it to be flexible but it worked here.
I tried debugging the script and kind of narrowed it down to the resizeWindow->redrawSlider handler is what causes the display to right itself (not specifically the developer tools but the resize window event that happens when you open them) - out of time but if I have a better solution tomorrow will let you know.