UPDATE: jFlow Plus has a new update and this article is no longer updated. Please go to jFlow Plus v2 to view the most recent version’s documentation, demo and download.

jQuery Sliders make a great addition to any website. The ideal slider should allow the user to flip through each slide and have a timer countdown for auto slide functionality. The jFlow plugin for jQuery is a good slider that is easy to implement, but unfortunately lacks an auto slide functionality. Let’s examine how we can extend this plugin to offer an improved jFlow slider with autoslide and pause functionality.

jFlow Plus - The Light-Weight Slider... Improved.

Devin Walker is a San Diego-based WordPress Developer and enthusiast. He is the author of several popular and highly-rated WordPress themes and plugins. In his free time he enjoys playing Golf and traveling.

Follow
Devin

Is your WordPress Running Slow?

Milliseconds are money. Website speed is extremely important. We highly recommend WP Engine. Why? Because they make a sluggish WP site fast, support is great and they have excellent uptime.

WP Engine Logo
  • http://ChrisNager.com Chris Nager

    I have used jFlow Plus and love it. Is there a way to make jFlow Plus transitions fade instead of slide?

    I know there are plenty of jQuery faders out there, but I have all the HTML/CSS set up for jFlow. I am wondering if someone could walk me through tweaking the JavaScript to make the slides transition by fading in/out instead of sliding off to the left.

    Thanks in advance.

    • Anonymous

      Hey there Chris,

      I’m actually planning on updating jFlow Plus to include fade functionality. I haven’t had time to do it lately, but I just need a block of time to sit down and slam it out. So my advice to you would be to either wait for me to code it out, code it yourself (and do share if you accomplish this) or switch to another one of jQuery’s wonderful sliders.

  • http://ChrisNager.com Chris Nager

    I have used jFlow Plus and love it. Is there a way to make jFlow Plus transitions fade instead of slide?

    I know there are plenty of jQuery faders out there, but I have all the HTML/CSS set up for jFlow. I am wondering if someone could walk me through tweaking the JavaScript to make the slides transition by fading in/out instead of sliding off to the left.

    Thanks in advance.

    • Anonymous

      Hey there Chris,

      I’m actually planning on updating jFlow Plus to include fade functionality. I haven’t had time to do it lately, but I just need a block of time to sit down and slam it out. So my advice to you would be to either wait for me to code it out, code it yourself (and do share if you accomplish this) or switch to another one of jQuery’s wonderful sliders.

  • zeejah

    cooool … can we use multiple sliders on same page? i tried to use it but messed up everything. any ideas??

  • zeejah

    cooool … can we use multiple sliders on same page? i tried to use it but messed up everything. any ideas??

  • zeejah

    cooool…
    is there possibility of having more than one sliders on same page???

    • http://wordimpress.com Devin Walker

      This is planned for the next release

  • zeejah

    cooool…
    is there possibility of having more than one sliders on same page???

    • http://wordimpress.com Devin Walker

      This is planned for the next release

  • Centinel3

    Love the tutorial. Is there a way to adjust the time duration of each slide. I want to make each image slide after 3 seconds. I know I can adjust the slide transition time, though the actual slide time would be good to have control over. Please let me know. Thanks again. -Chris

    • cheapsally

      Yes you can change this by scrolling to line 286 and changing the defaul 10000ms to a number higher or lower depending on you slide time preference.

      timer = setInterval(function() {
      $(opts.next).click();
      }, 10000);

      ——
      Change the 10000 above to whatever number you desire in milliseconds

  • http://www.facebook.com/people/Devvo-Pierre/100001463651002 Devvo Pierre

    Hi, thanks for the tutorial!How come I get all the images showing at once and the slider does not slide the images?I’m using it in the twenty ten theme that I’m tweaking. I placed the #container box after the #header div box and before the #wrapper div box in the twenty ten theme.

    Ignore! It’s the custom cms I’m coding that makes it act weird, nothing wrong with this code!

    Thanks again for the tut!

    • cheapsally

      Hi there,

      If you have all images showing at once then most likely your JavaScript isn’t referenced properly or the structure of your elements is off.

      Oh I just saw that you said to ignore this, anyways glad you enjoyed!

  • http://www.facebook.com/people/Devvo-Pierre/100001463651002 Devvo Pierre

    Hi, thanks for the tutorial!

    How come I get all the images showing at once and the slider does not slide the images?

    I’m using it in the twenty ten theme that I’m tweaking. I placed the #container box after the #header div box and before the #wrapper div box in the twenty ten theme.

    Ignore! It’s the custom cms I’m coding that makes it act weird, nothing wrong with this code!

    Thanks again for the tut!

  • http://twitter.com/WordImpress Devin Walker

    Currently there is not an option to use multiple sliders, although in the future this may be released in an update.

  • http://twitter.com/WordImpress Devin Walker

    Hi there,

    If you have all images showing at once then most likely your JavaScript isn’t referenced properly or the structure of your elements is off.

    Oh I just saw that you said to ignore this, anyways glad you enjoyed!

  • http://twitter.com/WordImpress Devin Walker

    Yes you can change this by scrolling to line 286 and changing the defaul 10000ms to a number higher or lower depending on you slide time preference.

    timer = setInterval(function() {
    $(opts.next).click();
    }, 10000);

    ——
    Change the 10000 above to whatever number you desire in milliseconds

  • http://twitter.com/basedrop basedrop

    Hello,
    Is there a way to create a link to the page that will start the slide show on a specific slide?

    • http://www.wordimpressed.com Devin Walker

      Hmm, I’m not quiet sure what you’re asking but if I understand correctly this should be fairly straight forward.

      • http://twitter.com/basedrop basedrop

        Wondering if I can create a url like mydomain.com#slider2 and have the content slider on the page open on the second slide.

        • Raven

          anyone knows how to do this please??

  • http://twitter.com/basedrop basedrop

    Hello,
    Is there a way to create a link to the page that will start the slide show on a specific slide?

    • http://www.dlocc.com DLOCC

      Hmm, I’m not quiet sure what you’re asking but if I understand correctly this should be fairly straight forward.

      • http://twitter.com/basedrop basedrop

        Wondering if I can create a url like mydomain.com#slider2 and have the content slider on the page open on the second slide.

        • Raven

          anyone knows how to do this please??

  • http://twitter.com/basedrop basedrop

    Hello,
    Is there a way to create a link to the page that will start the slide show on a specific slide?

  • wpactive

    Can use zoomout zoomin effects?

  • wpactive

    Can use zoomout zoomin effects?

  • Alastair Hodgson

    +1 for the multiple sliders feature, anyone know a hacky way to achieve this?

  • Alastair Hodgson

    +1 for the multiple sliders feature, anyone know a hacky way to achieve this?

  • Alastair Hodgson

    What would also make this amazing is a history ability, so that you can link to an individual slide within the gallery, has anyone modified the gallery to suit this purpose?

    • cheapsally

      Hmm, this is definitely possible although I’m not so sure that is really necessary for all implementations.

      • http://marcustucker.com Marcus Tucker

        It’s becoming standard practice to ensure that the state of sliders, accordions, and other interactive elements of a page are persisted in the URL and can be navigated via history, so adding support for this gets my double-handed vote.Rather than write your own implementation, I suggest you should detect the presence of http://www.asual.com/jquery/address or http://benalman.com/projects/jquery-bbq-plugin (these are the two de facto plugins for URL state persistence and will likely already be used in a given page if the user cares about this kind of thing) and use whichever is found.

  • Alastair Hodgson

    What would also make this amazing is a history ability, so that you can link to an individual slide within the gallery, has anyone modified the gallery to suit this purpose?

    • http://twitter.com/WordImpress Devin Walker

      Hmm, this is definitely possible although I’m not so sure that is really necessary for all implementations.

      • Marcus Tucker

        It’s becoming standard practice to ensure that the state of sliders, accordions, and other interactive elements of a page are persisted in the URL and can be navigated via history, so adding support for this gets my double-handed vote.Rather than write your own implementation, I suggest you should detect the presence of http://www.asual.com/jquery/address or http://benalman.com/projects/jquery-bbq-plugin (these are the two de facto plugins for URL state persistence and will likely already be used in a given page if the user cares about this kind of thing) and use whichever is found.

        • http://wordimpress.com Devin Walker

          Hmm, although I agree with you that a lot of slider and such are leaning towards this I’d say that it’s not a complete necessity. I’d even venture to say that most sliders out there do not support this form of history recognition. I’d love to implement this for jFlow Plus, but lack of time has kept me from this endeavor.

  • Mel

    Everything working great except when I resize the browser window the arrows seem to move to the middle can’t figure out this problem…

    • cheapsally

      Hmm Sounds like you might have a CSS issue there.

  • Mel

    Everything working great except when I resize the browser window the arrows seem to move to the middle can’t figure out this problem…

    • http://twitter.com/WordImpress Devin Walker

      Hmm Sounds like you might have a CSS issue there.

  • Riddleyw

    When I click on the download button I get the draggable stars demo for Jquery UI. The JQ+ files are not in the zip.

    • cheapsally

      I’ve fixed the link, sorry for the mix up. Not sure how that happened but thanks for catching that and sharing.

  • Riddleyw

    When I click on the download button I get the draggable stars demo for Jquery UI. The JQ+ files are not in the zip.

    • http://twitter.com/WordImpress Devin Walker

      I’ve fixed the link, sorry for the mix up. Not sure how that happened but thanks for catching that and sharing.

  • Raven

    How can one create a url like mydomain.com#slider2 and have the content slider on the page open on the second slide? Is it possible to set which slide to move to after opening the page?

  • Raven

    How can one create a url like mydomain.com#slider2 and have the content slider on the page open on the second slide? Is it possible to set which slide to move to after opening the page?

  • Lam

    Is there a way to link to make hyperlinks to an individual slide?

  • Lam

    Is there a way to link to make hyperlinks to an individual slide?

  • http://www.facebook.com/maryrossa Mary Rosa Briceño

    what about thumbs? I mean like cmon sliders, thumb selection to slide. You should make more demos.

  • http://www.facebook.com/maryrossa Mary Rosa Briceño

    what about thumbs? I mean like cmon sliders, thumb selection to slide. You should make more demos.

  • http://www.facebook.com/maryrossa Mary Rosa Briceño

    what about thumbs? I mean like cmon sliders, thumb selection to slide. You should make more demos.

  • http://www.facebook.com/maryrossa Mary Rosa Briceño

    what about thumbs? I mean like cmon sliders, thumb selection to slide. You should make more demos.

  • http://jc-websolutions.com John Carlson

    So have you gotten your

  • http://jc-websolutions.com John Carlson

    So have you gotten your

  • http://jc-websolutions.com John Carlson

    So have you gotten your fade to work.. ? I’ve actually gotten mine to work.. by changing a few things.. I’ve added an option for fade: true or fade: false and also a pos: ‘absolute’ or pos: ‘relative’

    absolute is for the fade and relative is for the sliding.

    I can e-mail you my code if you like.. I’ve actually modified the original jquery.flow.1.2.auto.js file not your jflow.plus but they are similar.

    johncarlson21@gmail.com

    • mssbee

      John, I have sent you an email. I would love to have this script. I am using jquery.flow.1.2.auto.js so it would be perfect for me.

      • mssbee

        Thanks John, It works great. I really appreciate your sharing.

  • http://jc-websolutions.com John Carlson

    So have you gotten your fade to work.. ? I’ve actually gotten mine to work.. by changing a few things.. I’ve added an option for fade: true or fade: false and also a pos: ‘absolute’ or pos: ‘relative’

    absolute is for the fade and relative is for the sliding.

    I can e-mail you my code if you like.. I’ve actually modified the original jquery.flow.1.2.auto.js file not your jflow.plus but they are similar.

    johncarlson21@gmail.com

    • mssbee

      John, I have sent you an email. I would love to have this script. I am using jquery.flow.1.2.auto.js so it would be perfect for me.

      • mssbee

        Thanks John, It works great. I really appreciate your sharing.

  • http://jc-websolutions.com John Carlson

    Hey I also got some thumbs to work with my updated script if anyone wants it… just contact me.. at my website.. and I can send you the files.

    • Bobby Small

      Thanks John, your knowledge really helped!

  • http://jc-websolutions.com John Carlson

    Hey I also got some thumbs to work with my updated script if anyone wants it… just contact me.. at my website.. and I can send you the files.

    • Bobby Small

      Thanks John, your knowledge really helped!

  • http://twitter.com/nnes Hannes De Block

    Hi, this slider is awesome. As a matter of fact, I’ve just integrated it in my online portfolio: http://www.hannesdeblock.be/ For now, it’s only on the index-page. But I will use it on more pages soon.

    Thanks for sharing!

    • cheapsally

      Thanks Hannes,

      Glad you like it!

  • http://twitter.com/nnes Hannes De Block

    Hi, this slider is awesome. As a matter of fact, I’ve just integrated it in my online portfolio: http://www.hannesdeblock.be/ For now, it’s only on the index-page. But I will use it on more pages soon.

    Thanks for sharing!

    • http://twitter.com/WordImpress Devin Walker

      Thanks Hannes,

      Glad you like it!

  • Lazysand

    Very nice, thank you!

  • Lazysand

    Very nice, thank you!

    • http://wordimpress.com Devin Walker

      Hey, no problema.

  • Ali

    Is it possible to set a slide view that is different to the slideWrap width, so you can see a little bit of the next slide too? I modified the outputted inline css in firebug and it looked good, is their an extra option at al?

    • Alastair Hodgson

      “Is it possible to set a slide width” is what I meant lol

      • Alastair Hodgson

        I managed to shoehorn this functionality into the script if anyone else would find this useful or if the developer wants it, let me know.

  • Ali

    Is it possible to set a slide view that is different to the slideWrap width, so you can see a little bit of the next slide too? I modified the outputted inline css in firebug and it looked good, is their an extra option at al?

    • Alastair Hodgson

      “Is it possible to set a slide width” is what I meant lol

      • Alastair Hodgson

        I managed to shoehorn this functionality into the script if anyone else would find this useful or if the developer wants it, let me know.

  • http://www.gavinlikesdesign.com/ Swiftau

    Hi, is it possible to make the height of the slide relative to the content within it? Basically, auto height?

    I’ve height: auto; but doesn’t work.

    • http://twitter.com/m1kelynn Mike Lynn

      I needed the same thing.  Made it work by editing the .js file.  Do a search for ‘height’ and replace what comes after it with “auto”.  There’s three places that needs to be updated.  It’s dirty but it works.

  • http://www.gavinlikesdesign.com/ Swiftau

    Hi, is it possible to make the height of the slide relative to the content within it? Basically, auto height?

    I’ve height: auto; but doesn’t work.

    • http://twitter.com/m1kelynn Mike Lynn

      I needed the same thing.  Made it work by editing the .js file.  Do a search for ‘height’ and replace what comes after it with “auto”.  There’s three places that needs to be updated.  It’s dirty but it works.

  • Nell

    Hi there, I am having trouble adding more than 3 slides. It seems to ignore any more than 3 slides- works fine otherwise. All my slides are contained in the “mySlides” tag.
    What am I doing something wrong?

    • Guest

      I’m also having the same issue! Eventually I was able to get a 4th slide to appear but the content was somehow hidden. Does anyone have a solution?

      • Ali

        Did you make sure that the number of slide buttons is equal to the number of slides?

        • Nell

          Can I be a bit of a Noob and ask how you do that?

        • Nell

          Worked it out, thanks for the prompting :)

    • Sara

      I had difficulty figuring this out as well, so wanted to share what I learned in the process in case somebody else struggles with this!
      It has to do with the tag. The code supplied has this tag 3 times, which shows 3 slides. If you want to add a fourth slide (or more), you need to add this code so that the number of times this code appears equals the number of slides you want to appear.
      I’m more of a designer than a programmer, so hopefully I explained this in a way that makes sense!

      • Sara

        Sorry, the code I referred to was stripped out of the message. Let me try this again…
        (span class=”jFlowControl”)(/span)
        Obviously, don’t use parenthesis in your actual code!

  • Nell

    Hi there, I am having trouble adding more than 3 slides. It seems to ignore any more than 3 slides- works fine otherwise. All my slides are contained in the “mySlides” tag.
    What am I doing something wrong?

    • Guest

      I’m also having the same issue! Eventually I was able to get a 4th slide to appear but the content was somehow hidden. Does anyone have a solution?

      • Ali

        Did you make sure that the number of slide buttons is equal to the number of slides?

        • Nell

          Can I be a bit of a Noob and ask how you do that?

        • Nell

          Worked it out, thanks for the prompting :)

    • Sara

      I had difficulty figuring this out as well, so wanted to share what I learned in the process in case somebody else struggles with this!
      It has to do with the tag. The code supplied has this tag 3 times, which shows 3 slides. If you want to add a fourth slide (or more), you need to add this code so that the number of times this code appears equals the number of slides you want to appear.
      I’m more of a designer than a programmer, so hopefully I explained this in a way that makes sense!

      • Sara

        Sorry, the code I referred to was stripped out of the message. Let me try this again…
        (span class=”jFlowControl”)(/span)
        Obviously, don’t use parenthesis in your actual code!

        • http://twitter.com/JenGuevaraG Jen Guevara

          Thank you soooooooooo much!!! I’m also more a designer than a Programmer, so your explanation makes perfect sence!

  • mssbee

    Has anyone else had an FOUC (Flash of Unstyled Content) problem with their slide show? I have stopped the slides appearing vertically until the slide show is fully loaded by adding the style overflow:hidden to my slide show container div, but the top of the second slide still appears briefly. Any ideas?

    • Billy

      You might hide the slideshow and wait for the dom to fully load and for the plugin to initialize.

      I typically include a css file in my head, using JS, which contains CSS to hide JS stuff that has not been initialized yet (waiting for dom to load).

      Once the dom has loaded, and the plugin is ready, I will show the JS HTML content with jquery show() (or something similar).

      This allows me to show a progress bar in the background container of the div that will hold the, in this case, slideshow/slider.

      Does that make sense?

      • mssbee

        That makes sense. Would you be willing to share your code? Thanks for answering.

      • cheapsally

        Nice

  • mssbee

    Has anyone else had an FOUC (Flash of Unstyled Content) problem with their slide show? I have stopped the slides appearing vertically until the slide show is fully loaded by adding the style overflow:hidden to my slide show container div, but the top of the second slide still appears briefly. Any ideas?

    • Billy

      You might hide the slideshow and wait for the dom to fully load and for the plugin to initialize.

      I typically include a css file in my head, using JS, which contains CSS to hide JS stuff that has not been initialized yet (waiting for dom to load).

      Once the dom has loaded, and the plugin is ready, I will show the JS HTML content with jquery show() (or something similar).

      This allows me to show a progress bar in the background container of the div that will hold the, in this case, slideshow/slider.

      Does that make sense?

      • mssbee

        That makes sense. Would you be willing to share your code? Thanks for answering.

      • Anonymous

        Nice

  • Elz064

    That’s a nice slider, but …

    The needed html markup is totaly invalid.

    You can’t wrap inside slide content into SPAN wich is online element.
    The arrow control are sapn too with div inside wich is just not possible

  • Elz064

    That’s a nice slider, but …

    The needed html markup is totaly invalid.

    You can’t wrap inside slide content into SPAN wich is online element.
    The arrow control are sapn too with div inside wich is just not possible

  • Jkent

    The slider works perfectly on Safari, Firefox(Mac), and IE. However, the slides, not the buttons, shift to the right in Firefox on a PC! A live reference to this problem is http://www.eyedentitygfx.com

    Any thoughts on how to fix this?

    • Jkent

      I thought I would share the answer to this for anyone searching in the future. Place this code in the JFlow CSS file

      #jFlowSlide {
      position: absolute !important;
      }

  • Jkent

    The slider works perfectly on Safari, Firefox(Mac), and IE. However, the slides, not the buttons, shift to the right in Firefox on a PC! A live reference to this problem is http://www.eyedentitygfx.com

    Any thoughts on how to fix this?

    • Jkent

      I thought I would share the answer to this for anyone searching in the future. Place this code in the JFlow CSS file

      #jFlowSlide {
      position: absolute !important;
      }

  • theseednetwork

    I’ve managed to get this to work with wordpress, but I want the featured section to auto change rather than have people click through it. The click through works but when I’ve added the auto: true feature nothing changes. You can view the site at.. http://theseednetwork.co.uk/ anyone got any advice?

    Thanks!

    • theseednetwork

      I just went back and stripped things back and fixed it myself, apparently you have to include the pointers to have the auto scroll function work. In the css I just applied ‘display: none’ via CSS.

  • http://twitter.com/keith_mason Keith Mason

    I’ve managed to get this to work with wordpress, but I want the featured section to auto change rather than have people click through it. The click through works but when I’ve added the auto: true feature nothing changes. You can view the site at.. http://theseednetwork.co.uk/ anyone got any advice?

    Thanks!

    • http://twitter.com/keith_mason Keith Mason

      I just went back and stripped things back and fixed it myself, apparently you have to include the pointers to have the auto scroll function work. In the css I just applied ‘display: none’ via CSS.

  • Chief Webhead

    Any way to change the behavior of jFlow when you reach the last image? My client doesn’t like the way it quickly slides back to the beginning image. She’d rather see it just go back to the first image without any visual animation. I can’t seem to find a way to do this.

    • Grant

      I’m also looking for an answer to this.  I think switching the animation altogether to fade in and out would do the trick as well.  Either way, I’d like to keep it from quickly sliding back to the first slide when it reaches the end.  Any help would be appreciated!

      • http://wordimpress.com Devin Walker

        Hey keep an eye out, I’m releasing a new version this week with this functionality.

  • Ventage

    Script is working as local in my pc. But when i upload to server and try to see it, I just see vertical slide images and script is not working.

    Any idea how to fix this?

    • Ventage

      Strange thing is. It is working in another server. I guess i have talk with support line.

  • Ventage

    Script is working as local in my pc. But when i upload to server and try to see it, I just see vertical slide images and script is not working.

    Any idea how to fix this?

    • Ventage

      Strange thing is. It is working in another server. I guess i have talk with support line.

  • http://www.priteshgupta.com Pritesh Gupta

    Cant get the arrows at http://bit.ly/lZsfxr, tried many things…!

  • http://www.priteshgupta.com Pritesh Gupta

    Nice thing..!

  • http://www.priteshgupta.com Pritesh Gupta

    Its WordPress version is there at  http://www.priteshgupta.com/plugins/jflow-plus/  or  http://wordpress.org/extend/plugins/jflow-plus/. 

    • http://www.priteshgupta.com Pritesh Gupta

      Echo…

  • http://www.priteshgupta.com Pritesh Gupta

    Its WordPress version is there at http://www.priteshgupta.com/plugins/jflow-plus/ or http://wordpress.org/extend/plugins/jflow-plus/. 

    • http://www.priteshgupta.com Pritesh Gupta

      Echo…

  • Carl

    Fantastic script thank ýou very much.

    Is it possible to loop the slider instead of rewinding it at the last slide?

    • http://www.wordimpressed.com Devin Walker

      Stay tuned: jFlow will be getting a BIG update soon.

      • Carl

        That sounds exciting! Looking forward to it…

  • Carl

    Fantastic script thank ýou very much.

    Is it possible to loop the slider instead of rewinding it at the last slide?

    • http://www.dlocc.com DLOCC

      Stay tuned: jFlow will be getting a BIG update soon.

      • Carl

        That sounds exciting! Looking forward to it…

  • Design1994

    When is the new version due?

    • http://www.wordimpressed.com Devin Walker

      Hopefully I can get out the beta this week! I’m trying my best to slam out the code.

  • Design1994

    When is the new version due?

    • http://www.dlocc.com DLOCC

      Hopefully I can get out the beta this week! I’m trying my best to slam out the code.

  • Steve Robinson

    Post removed as issue resolved (my finger trouble!)

  • Steve Robinson

    I’m using JFlow which is included in Organic Theme’s Block WordPress theme. http://www.organicthemes.com/

    I have upgraded my site  http://www.manchesterguitartech.co.uk/  to use JFlow+ but a problem persists in that when the site window is not active for some time, then made active, the slider appears to “catch up” by moving very quickly. 

    Is this a known issue with JFlow+ and if so, is there a fix? Thanks.

  • Brandon Mills

    I have it working, brilliant. BUT, I cannot get the duration to change. No matter what value I enter, it takes about 8-10 seconds to go from frame to frame.

    EDIT: I just realized that duration is the transition time. What I need is to make the automatic change from slide to slide quicker. For example, with 3 images, it would stay 4 seconds on each image, or 12 seconds to cycle through all three images.

    • http://www.wordimpressed.com Devin Walker

      Do you have a link to your slide?

      • Brandon Mills
      • Brandon Mills

        I’m still trying to figure this one out. How do you control the time that is spent on each frame/slide?

        • http://www.wordimpressed.com Devin Walker

          Hi Brandon,

          You will need to go into your jflow.plus.js file and on line 289 modify the timer slide number you see in milliseconds from 10000 to the proper time duration you’re looking for.  The lower the number, the faster the slides skip.

          Please note: This will be an option in the new version of jFlow Plus that I will be releasing shortly.  Keep an eye out for it, I just have to wrap up a few bugs and create some documentation before it’s released.

          Hope this helps you,

          Devin

          • Brandon Mills

             That fixed it! Thanks so much!

  • Brandon Mills

    I have it working, brilliant. BUT, I cannot get the duration to change. No matter what value I enter, it takes about 8-10 seconds to go from frame to frame.

    • http://www.dlocc.com DLOCC

      Do you have a link to your slide?

      • Brandon Mills
      • Brandon Mills
      • Brandon Mills

        I’m still trying to figure this one out. How do you control the time that is spent on each frame/slide?

        • http://www.dlocc.com DLOCC

          Hi Brandon,

          You will need to go into your jflow.plus.js file and on line 289 modify the timer slide number you see in milliseconds from 10000 to the proper time duration you’re looking for.  The lower the number, the faster the slides skip.

          Please note: This will be an option in the new version of jFlow Plus that I will be releasing shortly.  Keep an eye out for it, I just have to wrap up a few bugs and create some documentation before it’s released.

          Hope this helps you,

          Devin

          • Brandon Mills

             That fixed it! Thanks so much!

  • Rodrigo

    This slider came with just 3 images… Can I put more slides?
    How can I do it?

    tnx

    • http://www.wordimpressed.com Devin Walker

      Yes you can, stay tuned… jFlow Plus v2 coming at you soon with demos and instructions how to insert as many slides as you need.

  • Rodrigo

    This slider came with just 3 images… Can I put more slides?
    How can I do it?

    tnx

    • http://www.dlocc.com DLOCC

      Yes you can, stay tuned… jFlow Plus v2 coming at you soon with demos and instructions how to insert as many slides as you need.

  • Grant

    I’m also looking for an answer to this.  I think switching the animation altogether to fade in and out would do the trick as well.  Either way, I’d like to keep it from quickly sliding back to the first slide when it reaches the end.  Any help would be appreciated!

  • Brandon Mills

    Any update on the new version release date? Client really on my tail regarding the loop/rewind problem. Thanks so much.

    • http://www.wordimpressed.com Devin Walker

      It’s looking like I’ll have some time tonight to finish up some code and pushing for release either tomorrow or the day after.  If you’re really in a bind let me know and maybe I can send you over something prerelease.

      • Brandon Mills

        No, I’ll be patient and wait like everyone else :)

  • Brandon Mills

    Any update on the new version release date? Client really on my tail regarding the loop/rewind problem. Thanks so much.

    • http://wordimpress.com Devin Walker

      It’s looking like I’ll have some time tonight to finish up some code and pushing for release either tomorrow or the day after.  If you’re really in a bind let me know and maybe I can send you over something prerelease.

      • Brandon Mills

        No, I’ll be patient and wait like everyone else :)

  • Kristopher Reif

    The slider works perfectly in Firefox and IE, however is completely inactive in Safari and Chrome. Any ideas what could be causing this?

  • Kristopher Reif

    The slider works perfectly in Firefox and IE, however is completely inactive in Safari and Chrome. Any ideas what could be causing this?

  • Brandon Mills

    Thanks for all your work and contribution to the community. Just wondering if there is a new release date (even if Beta) for JFlow Plus v2. Thanks!

  • Brandon Mills

    Thanks for all your work and contribution to the community. Just wondering if there is a new release date (even if Beta) for JFlow Plus v2. Thanks!

  • http://www.justgowebyourself.com Katelyn

    This is a beautiful slider and it looks perfect when I implement it into Firefox. However, it’s not working at ALL in IE for me?! It looks like a vertical row of images that wont display and no slider whatsoever. Does anyone at all have any suggestions for me?? Would be greatly appreciated…

    • http://www.wordimpressed.com Devin Walker

      Full compatibility coming with v2.0 out next week!

  • http://www.justgowebyourself.com Katelyn

    This is a beautiful slider and it looks perfect when I implement it into Firefox. However, it’s not working at ALL in IE for me?! It looks like a vertical row of images that wont display and no slider whatsoever. Does anyone at all have any suggestions for me?? Would be greatly appreciated…

    • http://wordimpress.com Devin Walker

      Full compatibility coming with v2.0 out next week!

    • http://wordimpress.com Devin Walker

      Full compatibility coming with v2.0 out next week!

  • http://www.pablomassa.com Pablo Massa

    Great Slider!

    I used it here
    http://pablomassa.com/tumblr-no-tumblr/gone-with-the-wind-2011-s-revisited-ending/

    I must figured out how to add more slides. It’s simply, you must add one  for each .

    Thanks!

    • http://www.wordimpressed.com Devin Walker

      Hey Pablo, 

      Looks like you got it working!  I’m glad and it looks good.  I <3 Gone with the Wind.

  • http://www.pablomassa.com Pablo Massa

    Great Slider!

    I used it  here
    http://pablomassa.com/tumblr-no-tumblr/gone-with-the-wind-2011-s-revisited-ending/

    I must figured out how to add more slides. It’s simply, you must add one   for each .

    Thanks!

    • http://wordimpress.com Devin Walker

      Hey Pablo,  

      Looks like you got it working!  I’m glad and it looks good.  I <3 Gone with the Wind.

    • http://wordimpress.com Devin Walker

      Hey Pablo,  

      Looks like you got it working!  I’m glad and it looks good.  I <3 Gone with the Wind.

  • http://preek.myopenid.com/ Alain M. Lafon

    I love the slider and just used it in the last project. Unfortunately I realized late that it does not work with Internet Explorer 8.

  • http://preek.myopenid.com/ Alain M. Lafon

    I love the slider and just used it in the last project. Unfortunately I realized late that it does not work with Internet Explorer 8.

  • http://preek.myopenid.com/ Alain M. Lafon

    Hi there,

    let me begin with saying that you’ve created a great slider! But after using it in the last project, I realized that it does not work with IE8, which is a little bit of a deal breaker.

    Anyway, thanks for your effort and great work!

    Best regards,
    Alain

    • http://www.wordimpressed.com Devin Walker

      I admit, this version of jFlow is a bit outdated but don’t fret! I’m releasing jFlow 2.0 soon and it’s compatible with IE7+ so keep in touch and it’ll be out in the coming week. Thanks for your feedback… if you’re in dire straights I can give you a sneak peek.

      • kennywyland

        Where can I find the new jflow 2.0? I’m trying to debug someone else’s jflow code and we’re having a problem with jflow crashing the browser if we try to resize it while it is loading on Mac. Any thoughts?

  • http://preek.myopenid.com/ Alain M. Lafon

    Hi there,

    let me begin with saying that you’ve created a great slider! But after using it in the last project, I realized that it does not work with IE8, which is a little bit of a deal breaker.

    Anyway, thanks for your effort and great work!

    Best regards,
    Alain

    • http://wordimpress.com Devin Walker

      I admit, this version of jFlow is a bit outdated but don’t fret! I’m releasing jFlow 2.0 soon and it’s compatible with IE7+ so keep in touch and it’ll be out in the coming week. Thanks for your feedback… if you’re in dire straights I can give you a sneak peek.

      • Anonymous

        Where can I find the new jflow 2.0? I’m trying to debug someone else’s jflow code and we’re having a problem with jflow crashing the browser if we try to resize it while it is loading on Mac. Any thoughts?

  • Obi Onuorah

    Hi, this is cool and I’m currently using it ona mobile site and it works! However I know this is a very late wish but if it is not already there and I’m just too dumb to figure it out, could you add a feature so that it can start from some externally specified slide other than the first, maybe it could pick this value from the query string/cookie???? wherever. If this is already implemented could someone just educate me…Thanks a million.

  • Obi Onuorah

    Hi, this is cool and I’m currently using it ona mobile site and it works! However I know this is a very late wish but if it is not already there and I’m just too dumb to figure it out, could you add a feature so that it can start from some externally specified slide other than the first, maybe it could pick this value from the query string/cookie???? wherever. If this is already implemented could someone just educate me…Thanks a million.

  • Julie

    Love this!!  Thanks for the time you put in!

    Looks awesome … but not so much in IE7, where the images fly by and then disappear.  Can’t wait for your update on that! 

  • Julie

    Love this!!   Thanks for the time you put in!

    Looks awesome … but not so much in IE7, where the images fly by and then disappear.  Can’t wait for your update on that!  

  • eudew

    The plugin for WordPress didn’t work until I went to “Settings” > “JFlow Plus” and clicked “Update Options”. For some reason, the initial settings weren’t loaded even though I activated the plugin.

  • Anonymous

    The plugin for WordPress didn’t work until I went to “Settings” > “JFlow Plus” and clicked “Update Options”. For some reason, the initial settings weren’t loaded even though I activated the plugin.

  • Affan Rauf

    line# 155 height: $(jFS).height()+”px”,

    The code at line# 155 should not be there as it will set the height relatively. We only want to set width relatively. Right?

  • Affan Rauf

    line# 155 height: $(jFS).height()+”px”,

    The code at line# 155 should not be there as it will set the height relatively. We only want to set width relatively. Right?

  • Paul

    any news on the new version with IE7+ compatibility?

  • Paul

    any news on the new version with IE7+ compatibility?

  • Draino

    can i add videos?

  • Draino

    can i add videos?

  • Osaama Mohammed

    thanks

  • Osaama Mohammed

    thanks

  • Ron_wolpa

    HOW TO ADD MORE PICTURES   jFlow Plus v2  Compact slider

    is there any article / tutorial about this
    matter ???

    Having a hard time to add over than 3 pictures.

    Please help me out.

    Thank
    you for your attention

  • Ron_wolpa

    HOW TO ADD MORE PICTURES     jFlow Plus v2   Compact slider

    is there any article / tutorial about this
    matter ???

    Having a hard time to add over than 3 pictures.

    Please help me out.

    Thank
    you for your attention

  • Ranis86kb

    when im pressing "Next" on a last picture, slider sliding to the top across all slides ive seen. When i press “previous” on the first picture of slider, slider goest to end across all slides. Is a problem have a solve?

  • Ranis86kb

    when im pressing "Next" on a last picture, slider sliding to the top across all slides ive seen. When i press “previous” on the first picture of slider, slider goest to end across all slides. Is a problem have a solve?

  • http://twitter.com/zrzonln ♏ Helge-K. Wang

    Great plug-in, but I miss real transition effects though.

  • http://twitter.com/zrzonln ♏ Helge-K. Wang

    Great plug-in, but I miss real transition effects though.

  • Julian

    muy bonito

  • Julian

    muy bonito

  • Miguel

    nice!!

  • Miguel

    nice!!

  • ´pit

    hi!!! i dont know this program even I dont know to speak english just I wolud like to know if is the same to use dreamwevar instead of jflow???

    • http://www.wordimpressed.com Devin Walker

      I’m confused here… dreamweaver and jFlow?

    • Ricardo Alberto Chi García

      Hi, jflow and dreamweaver are different things, while jflow its a library of jQuery, DreamWeaver is a IDE, or an program to design an HTML content or with a different languaje, as PHP.

      Saludos!, jFlow y DreamWeaver son cosas diferentes, mientras jFlow es una libreria de jQuery, DreamWeaver es un IDE, o un programa para diseñar contenido HTML o con otro lenguaje diferente, como PHP.

  • Ricardo Alberto Chi García

    Excelent tool, I really apreciate your work. Thanks for share us.

  • nclayn

    It’s working great. I was wondering how I could change how it automatically goes through the slides though. Ideally, I would like it to stay on the first slide and only move through the slides if the arrows were clicked. Any help would be awesome. Thank you.

  • Irving

    thanks!!!, it was useful for me… I was searching something like this

  • Alicia

    Hi, is it possible to put a link to each image in the slide?
    How can I do it?
    Thanks!

  • cheapsally

    Currently there is not an option to use multiple sliders, although in the future this may be released in an update.