The first time you load and visit some of the slides on this page http://www.blythestoves.co.uk/new the correct height doesn't render. Some information is cut off. Go to slide 2 (Ecomaster BB1) and under the images of the air flow dials there should be some info on the warranty. The page doesn't render that last text block.
Here is the weird part. If you refresh the page nothing happens but if you go to the address bar and click in there and push return again the page will load correctly with the height all correct.
I really don't understand and have spent too much time on this already. Any help would be really great.
Thanks.
The main issue is that webkit browsers fire off the document ready event before the images start loading and thus the image dimensions have not been obtained. So if you include the image dimensions in the css or inline:
<img src="images/blythe-ecomaster-bb2.jpg" style="width:1228px;height:678px;" />
then the slider height will be appropriately sized.
Additionally, the width option in the slider initialization has been deprecated, so you can only set the slider dimensions using css. So you can remove this line, because it doesn't do anything:
width : 1228, // Override the default CSS width