Make ContentFlow continuously auto-scroll?
I have ContentFlow implemented on a site cookbookfavors.com and would like to know if there was a way to modify the script so it would automatically scroll through the items? Even if someone could point me to where to look in the code, to add a loop, or something... Thanks!
EDIT: The script:开发者_JS百科 http://www.jacksasylum.eu/ContentFlow/index.php
There is nothing in the documentation that would help... I'd have to modify code.
Yes, but the answer is not to "modify the script." Instead, you will write a small helper script to call the ContentFlow's moveTo
method every "x" seconds. The ContentFlow library itself does not need to be changed.
See the docs for the library's moveTo
method.
Your script should do the following:
- Wait for the page's dom to stabilize
- Create the ContentFlow instance
- Start a loop. In the loop, first delay x seconds. Then call the
moveTo
method to move to the next item.
You'll also need to track which is the current item. Ask if you need more info.
Added Turns out, there is a slideshow AddOn for the ContentFlow library that will handle the auto-scrolling for you. See the docs that show you how to add in an AddOn.
If you don't want the users to see the start/stop slideshow controls, try hiding them via CSS.
I did it in a very simple way, no need for a slideshow AddOn. Here's a code sample to get you started:
var myCf = new ContentFlow('myContentFlow', {
circularFlow: true,
loadingTimeout: 60000
});
function go_to_next_and_wait() {
setTimeout(function() {
myCf.moveTo('right');
go_to_next_and_wait();
}, 5000); // 5000ms = 5 seconds
}
$(document).ready(function() {
go_to_next_and_wait();
});
精彩评论