Nivo slider issue

Hi,

please take a look at this webpage.

Everytime you load a new page, all of the images in the slideshow are visible. How can I fix this? Is this a jquery or CSS problem?

Any advice is appreciated. Thanks!

It’s a CSS issue. The height of #slider is being set by the JavaScript, but that takes a while to load.

What I would do is add that height here:

#slider {
  display: block;
  overflow: hidden;
  width: 1000px;
  [COLOR="Red"]height: 288px;[/COLOR]
}

However, that will mean that, if JS is off, the only the first pic will be viewable, so in that case I would add in overflow: scroll only for when JS is off, but that’s up to you.

Oh right, thanks a lot :slight_smile:

And what if I want the slider to start at a random image and not the first image in the folder? I know Nivo has an option for this:


<script type="text/javascript">
$(window).load(function() {
    $('#slider').nivoSlider({
        startSlide:0, // Set starting Slide (0 index)
    });
});
</script>

How do I change that?

<script type="text/javascript">
jQuery(window).load(function() {
	jQuery('#slider').nivoSlider({ 
		
	});
	
});
</script>

I should replace the above code with the following code:

<script type="text/javascript">
$(window).load(function() {
var total = $('#slider img').length;
var rand = Math.floor(Math.random()*total);
$('#slider').nivoSlider({
	effect:'random', //Specify sets like: 'fold,fade,sliceDown'
	slices:15,
	animSpeed:1000,
	pauseTime:10000,
	[COLOR="Red"]startSlide:rand[/COLOR]
	});
});
</script>

But the slider starts with 1 and stopped working.

On the Nivo site they suggest this:

var total = $('#slider img').length;
var rand = Math.floor(Math.random()*total);
$('#slider').nivoSlider({
     startSlide:rand
});

Yes but that’s the same as the one I posted right? That doesn’t work for me.
I think it’s because the images aren’t wrapped into links.

That random code shouldn’t behave differently without links. Do you have a link to the page so we can see exactly what’s happening?

See the first post. :slight_smile:

Haha…how did I miss that?! :slight_smile: Thank you!!!