简体   繁体   中英

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: 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:

  1. Wait for the page's dom to stabilize
  2. Create the ContentFlow instance
  3. 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();
});

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM