CODEWITHSUNDEEP
jquerysetintervaltiming
Psygno
Psygno

Reputation: 261

jquery change div content on time interval

Have a look at this pic: enter image description here You can see a Quote block under the image slider (it's nivo slider if it's useful). I have to change the sentence in the quote block every time the image changes. I thoungh that was impossible, but just thinking a bit pheraphs I can set an interval with setInterval() to the quote block and set the time in a way that fit the slider time.

I don't really know how to do it I think I have to set an array of sentence that are display in html at a specific time... Oh and I need a fade effect but I don't think it is a problem...

Thanks a lot in advace

Upvotes: 0

Views: 1146

Answers (2)

isherwood
isherwood

Reputation: 61083

I would think that you could achieve your goal with Nivo Slider's built in caption functionality. You can style the caption element as needed.

"To add a caption to an image you simply need to add a title attribute to the image. To add an HTML Caption simply set the title attribute to the ID of a element that contains your caption (prefixed with a hash). Note that the HTML element that contains your caption must have the CSS class nivo-html-caption applied and must be outside of the slider div."

http://dev7studios.com/nivo-slider/#/documentation

If that doesn't suit, use an afterChange function to update your caption element:

$('#slider').nivoSlider({
    afterChange: function() {
        // Do your caption update here.
    }
});

Upvotes: 1

Prakash Chennupati
Prakash Chennupati

Reputation: 3226

why dont you use the Cycle Plugin it sounds like exactly what you are looking for.The plugin provides a method called cycle which is invoked on a container element. Each child element of the container becomes a "slide". Options control how and when the slides are transitioned.

here is a sample Demo

$(document).ready(function() {
    $('.slideshow').cycle({
        fx: 'fade' // choose your transition type, ex: fade, scrollUp, shuffle, etc...
    });
});

Upvotes: 0

Related Questions