Results 1 to 9 of 9

Thread: restarting Ultimate fade in slide show on mobile

  1. #1
    Join Date
    Dec 2016
    Posts
    4
    Thanks
    1
    Thanked 0 Times in 0 Posts

    Default restarting Ultimate fade in slide show on mobile

    1) Script Title: Ultimate fade in slideshow

    2) Script URL (on DD): http://www.dynamicdrive.com/dynamici...nslideshow.htm

    3) Describe problem: Not a problem but a feature. The script works great. Thank you. However on android a swipe will stop the slideshow. It now is swipe only. I can't figure out how to get it to resume the slideshow other than reloading the page.

    I've included the jquery.touchSwipe.min.js but have set no options for it. To say the least his documentation is a bit obtuse. And here I am asking for help.

  2. #2
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    30,495
    Thanks
    82
    Thanked 3,449 Times in 3,410 Posts
    Blog Entries
    12

    Default

    First try adding "extra buttons" - you can add only the pause play option if that's all you want. See:

    http://www.dynamicdrive.com/forums/e...e-in-slideshow

    Demo:

    http://jscheuer1.com/garden/

    If you need help after viewing the options' explanations included in the distribution file, just let me know.
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

  3. The Following User Says Thank You to jscheuer1 For This Useful Post:

    grantiago (01-01-2017)

  4. #3
    Join Date
    Dec 2016
    Posts
    4
    Thanks
    1
    Thanked 0 Times in 0 Posts

    Default

    Thanks. I would like to hide the numbered image buttons. Depending on the run there are around 60 images. The numbered image buttons are distracting -- overwhelming. I only need the play/pause, status and toggle buttons. If I alter the divs and spans it seems to kill the status div and the pause/play button. same with changing the pend option.

  5. #4
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    30,495
    Thanks
    82
    Thanked 3,449 Times in 3,410 Posts
    Blog Entries
    12

    Default

    If you're working from my garden demo, in the init where you have:

    Code:
    extrabuttons: {pend: '.bob', navfade: 0.65, navbutonly: true},
    either set pend to false and get rid of the rest in there (change to):

    Code:
    extrabuttons: {pend: false},
    Even if you're not using my demo as a template, simply changing 'pend' to false will probably do the trick, of course if you do that and still have navfade: 0.65, navbutonly: true, those parts can be removed. You can of course keep any other options that you might have besides those if they're working well for you.

    Or, if you don't like those results, get rid of the buttons with style (place in a style section or stylesheet for the page):

    Code:
    .extrabutspan {display: none !important;}
    For more information:

    In the distribution archive, there are usage instructions (distro/extrabuttons_usage.htm), load it in the browser to read it.

    If you want more help, please supply a link to your page or post your init and markup.
    Last edited by jscheuer1; 01-23-2017 at 11:25 PM. Reason: add info
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

  6. #5
    Join Date
    Dec 2016
    Posts
    4
    Thanks
    1
    Thanked 0 Times in 0 Posts

    Default

    I was using the demo.htm in the distro. I copied the garden demo and both the init or the css corrections work. Thanks. Then I copied the html over to the ...demo.htm and all is fine.

    I had tried both those options before posting. But in the ...demo.htm they killed the play/pause button as well as the slideshow.

    Is there a css option to change the player background to white? I have fiddled around and can't get it done on the page itself. I've done it by editing the .js. I imagine there is a better option.

    if I had any js skills at all I would replace the numbered boxes with a slider or progress bar. ;-)

  7. #6
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    30,495
    Thanks
    82
    Thanked 3,449 Times in 3,410 Posts
    Blog Entries
    12

    Default

    To change background in style, use:

    Code:
    #fadeshow1 .gallerylayer {background-color: white !important;}
    where fadeshow1 is the wrapper id for the slideshow.

    A progress bar doesn't seem too difficult. I'll have to think about adding that. A slider, one that you could drag to control the images is probably doable, but seems daunting even to me. I know there's basic code for that already (jQuery UI has some, likely others) though, just needs to be adapted to the slideshow.
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

  8. #7
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    30,495
    Thanks
    82
    Thanked 3,449 Times in 3,410 Posts
    Blog Entries
    12

    Default

    Mmm, I actually found a nice touch friendly slide control that I was able to make work with this. It requires a very slightly modified extrabuttons.js, some external scripts and an external css file, some added markup, and some code added to the slideshow init. If you're interested, let me know.
    Last edited by jscheuer1; 01-29-2017 at 03:12 AM. Reason: add info
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

  9. #8
    Join Date
    Nov 2014
    Location
    On A Scottish Island
    Posts
    488
    Thanks
    0
    Thanked 62 Times in 58 Posts

    Default

    Quote Originally Posted by jscheuer1 View Post
    To change background in style, use:

    Code:
    #fadeshow1 .gallerylayer {background-color: white !important;}
    where fadeshow1 is the wrapper id for the slideshow.
    .
    .
    .
    John, thanks for that tip. I have been using this slideshow for several years (usually having multiple slideshows in each month's magazine page) and have also hacked the .js file to get a white background. I did try to find a way of adding background colour to the settings for each slide show but failed to make it work, so the CSS solution is very helpful.

  10. #9
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    30,495
    Thanks
    82
    Thanked 3,449 Times in 3,410 Posts
    Blog Entries
    12

    Default

    Here's a demo with the slide controller:

    http://jscheuer1.com/garden/index_slide_control.htm

    It's somewhat customized so as to be responsive (to different screen sizes for this particular sideshow, I have a simpler version). There are a few options to play with if you want/need to both with the slider:

    https://refreshless.com/nouislider/

    and how it's integrated into the slideshow. Most of which is controlled in the extrabuttons_add_noUiSlider.js file. Look and feel is controlled to an extent in css. Again, to do this you need:

    1.) noUiSlider css and js (either the min or non-min versions, available at the above link)

    2.) the updated extrabuttons.js:

    http://jscheuer1.com/garden/extrabuttons.js

    3.) and the extrabuttons_add_noUiSlider.js file:

    http://jscheuer1.com/garden/extrabut..._noUiSlider.js
    Last edited by jscheuer1; 01-31-2017 at 12:08 AM. Reason: add info
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

Similar Threads

  1. Set Slide Duration for Ultimate Fade-In Slide Show Ver. 1.51
    By gary.mcgill in forum Dynamic Drive scripts help
    Replies: 1
    Last Post: 02-28-2014, 06:25 PM
  2. Ultimate Fade-In Slide Show - Audio file with each slide
    By gary.mcgill in forum Dynamic Drive scripts help
    Replies: 0
    Last Post: 02-26-2014, 01:22 PM
  3. Ultimate Fade-In Slide Show - Advance slide on mouse click
    By gary.mcgill in forum Dynamic Drive scripts help
    Replies: 3
    Last Post: 02-24-2014, 12:14 PM
  4. Ultimate Fade-in slide show- show text descriptions?
    By bobvaz in forum Dynamic Drive scripts help
    Replies: 9
    Last Post: 06-07-2007, 03:27 PM
  5. Ultimate Fade-in slideshow (v1.5) - Run function when restarting loop?
    By badtant in forum Dynamic Drive scripts help
    Replies: 1
    Last Post: 05-17-2006, 11:39 AM

Bookmarks

Posting Permissions

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