Nivo slider resize after loading issue

Question

I have used the Nivo slider on my site and i have a small issue. When my web page is loading the images appear in their full size then they resize down to what they are supposed to be. Please could someone let me know why this is happening or how i can prevent this?

It's probably also worth mentioning that it is fine once the first page is loaded, it only happens when you load the first page - but as we all know, first impressions count!

The url is: http://www.urbanedge-promotions.com/

Thanks for your help.

Daniel

Answer 1

set a default with css

add:

//stops the image from being larger than 100% width
.nivoSlider img {max-width: 100%!important}

or

//stops the image from being larger than 100% width
body .nivoSlider img {max-width: 100%}

or perhaps this, to override it in browsers that don't support max-width if needed:

//sets width to 100% by default
.nivoSlider img {width: 100%}

to your css, to override:

.nivoSlider img {max-width: none}

in nivo-slider.css