• Resolved walkingfish

    (@walkingfish)


    Hi,

    I was wondering how I can get the Nivo Slider to load b4 the rest of the content? I am using a fluid layout design and when the page loads, all the other content loads first and then the slider. Being that its a fluid layout, this looks tacky because the slider container doesn’t size up until the slider fully loads and then pushes the underlying content down. Ive tried some CSS hack w/o prevail.

    Basically I need a loading container to show [at the appropriate size] first.

    thnx for your help!

    http://wordpress.org/plugins/ml-slider/

Viewing 1 replies (of 1 total)
  • Hi walkingfix,

    This is probably a bit trickier than you might expect. Because Nivo slider is responsive, it doesn’t really have a set height.. it only knows it’s height once it’s loaded. The height will be different depending on the width of the browser. It also loads when the page is ‘ready’, that means immediately after all the CSS, JS & HTML is loaded.

    You could maybe do something like this to ‘reserve’ a space for the slideshow:

    .metaslider {
        height: 200px;
        width: 100%;
        float: left;
    }

    Then use some JavaScript to remove those rules once it’s loaded. The caveat is, for people on a mobile for example, the end slideshow might only be 100px high, but you’ve reserved a space thats 200px high.

    Regards,
    Tom

Viewing 1 replies (of 1 total)

The topic ‘Load NivoSlider before Content’ is closed to new replies.