Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 6 of 6
  1. #1
    New to the CF scene
    Join Date
    Apr 2012
    Posts
    3
    Thanks
    1
    Thanked 0 Times in 0 Posts

    Help Adding Stop-On-Click to Slideshow Script

    Hello everyone,

    I have a slideshow run by javascript that I need to add a function to - I purchased the script (It's called "Layerslider") from a site to help myself out, and I don't know how to write js or else I'd do it myself. Right now, there is a pause-on-hover functionality, but I need a pause-on-click so that if the user manually clicks to a new slide, it will pause the slideshow instead of continuing to cycle. This would take the place of the pause-on-hover function.

    Here is a page with the javascript on it (view the source to see the javascript used): http://www.ccu.edu/redesign/layersli...le/example.asp

    Any help anyone can provide would be great!

    Thanks in advance!

  • #2
    Regular Coder
    Join Date
    Apr 2012
    Posts
    165
    Thanks
    1
    Thanked 39 Times in 39 Posts
    This should be a pretty simple fix.

    1. Do a search for pauseOnHover and change the status from true to false. (There should only be 2 instances where it looks something like pauseOnHover: true and they are located near the bottom of the script) Those are the parts I'm telling you to edit. If you see it calling for an actual function such as "if( ls.o.pauseOnHover == true ){" don't change anything there!

    2. Do a search for navStartStop and change the status from true to false. (Once again, there should only be 2 instances that have a true/false option and they are located near the bottom of the script. Ignore any other references or function calls)

    3. Do a search for the entire line of code below:
    $(el).layerSlider( ($(this).index() + 1) );

    4. Once you find that line, add the following code immediately beneath it:
    $(el).layerSlider('stop');

    NOTE: It is very important that you add that line BEFORE the }); symbols that currently appear beneath the code listed in #3 above.

    In other words, it should look like this when you are done:

    $(el).layerSlider( ($(this).index() + 1) );
    $(el).layerSlider('stop');
    });

    That should do it! Good luck and let me know if you need more assistance. If you have problems with it, just let me know and I'd be happy to make the edits and send you the whole script as a txt file which you could just copy and paste to overwrite your existing code. However, I always think it's best to try to do it yourself first
    Last edited by EpicWebDesign; 04-25-2012 at 12:45 AM. Reason: Added a bit of extra instructions for clarity.

  • Users who have thanked EpicWebDesign for this post:

    rmantenesse (04-25-2012)

  • #3
    New to the CF scene
    Join Date
    Apr 2012
    Posts
    3
    Thanks
    1
    Thanked 0 Times in 0 Posts
    Thank you so much! That works perfectly!

    Now if I can be a little bit more of an annoyance, I have another question - if it's too much to ask, that's perfectly understandable and you don't have to answer:

    If I wanted to add a start-stop button to the right side only that
    switches from to play when it is paused (even when it is paused by click)
    and back to pause when play is clicked again
    (the default currently only has a play button on the left and a pause on the right),
    How would I do that?

    I can make the graphics myself, I would just need help with how to switch the graphic and the function depending on the state.

    Would you need to see the CSS for the skin in order to do that?

    Again, if this is too much, that's ok - what you've helped me with is already more than I could have hoped for.

  • #4
    Regular Coder
    Join Date
    Apr 2012
    Posts
    165
    Thanks
    1
    Thanked 39 Times in 39 Posts
    Glad it worked out for you!! Your other request shouldn't be a problem, but I'll need to review the code again to see if I can find you a simple solution. I've got to run out for a bit, but will look into it for you later. If I do need the CSS I'll PM you and let you know.

  • #5
    New to the CF scene
    Join Date
    Apr 2012
    Posts
    3
    Thanks
    1
    Thanked 0 Times in 0 Posts
    After fiddling with some stuff in the javascript, I was able put the pause button on the just right side, but I still need to figure out how to make it switch to the play button when the slideshow pauses.
    This new version is here: http://www.ccu.edu/redesign/layersli...e/example2.asp

    Thanks again for your help!

  • #6
    Regular Coder
    Join Date
    Apr 2012
    Posts
    165
    Thanks
    1
    Thanked 39 Times in 39 Posts
    Quote Originally Posted by rmantenesse View Post
    After fiddling with some stuff in the javascript, I was able put the pause button on the just right side, but I still need to figure out how to make it switch to the play button when the slideshow pauses.
    This new version is here: http://www.ccu.edu/redesign/layersli...e/example2.asp

    Thanks again for your help!
    Good job! I'll check out the new file in the morning. It's getting late here and I've learned long ago to NEVER write/edit code when tired... things usually go horribly wrong LOL


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •