on swipe to next slide; jump to top

jamesandrewmcnulty's Avatar

jamesandrewmcnulty

26 Sep, 2012 08:03 PM

Hi,

Is there a function already built it or a minor tweak that can be made so that when I swipe left or right to any given slide, instead of being taken halfway into the next slide, I'll be taken to the very top of the slide.

This is essentially being used for the content within a mobile site and so when swiping it's confusing when swiping into the next slide. I'm sure this could be a helpful option to others too.

Hope that makes sense

Thanks for any help!

  1. Support Staff 1 Posted by Dmitry Semenov on 27 Sep, 2012 07:10 PM

    Dmitry Semenov's Avatar

    Hi,

    Honestly, I don't really understand what you want, what you mean by "when swiping left it'll be taken to top of slide"? Please be more descriptive or draw simple illustration, and I'll tell you if it is possible.

    Dmitry

  2. 2 Posted by jamesandrewmcnu... on 27 Sep, 2012 07:29 PM

    jamesandrewmcnulty's Avatar

    I am using Royal Slider for the 'content slide' .

    I am using it for a mobile based website. So each 'slide' is a page.

    Being on a mobile device, the pages (slides) are quite long.

    So if I swipe in either direction I will be taken halfway into the next slide - ideally I would like to swipe and be taken to the very top of the next or previous slide.

    Hope that makes more sense, thanks for the response!

  3. Support Staff 3 Posted by Dmitry Semenov on 27 Sep, 2012 07:46 PM

    Dmitry Semenov's Avatar

    Oh, I get it now. Well, you may use slider API to scroll to top after slide change. See events subsection - http://dimsemenov.com/plugins/royal-slider/documentation/#api

    Dmitry

  4. 4 Posted by jamesandrewmcnu... on 27 Sep, 2012 08:07 PM

    jamesandrewmcnulty's Avatar

    great, thanks so much - I'm not actually that great with API - where would I edit / add code to make this happen? - I literally have no idea at this point.

  5. Support Staff 5 Posted by Dmitry Semenov on 27 Sep, 2012 08:29 PM

    Dmitry Semenov's Avatar

    If you don't work with JS I recommend you hiring someone, cause you may create mistakes that you're not aware of. Anyway, you need to put this code in document.ready(), after slider initialization, it'll scroll window to top before changing of slides.

    var slider = $('.royalSlider').data('royalSlider');
    slider.ev.on('rsBeforeAnimStart', function() { 
        $('html, body').animate({ scrollTop: 0 }, 200); 
    });
    

    Dmitry

  6. 6 Posted by jamesandrewmcnu... on 27 Sep, 2012 08:43 PM

    jamesandrewmcnulty's Avatar

    thank you so much - managed to figure that part out. I really appreciate your help!

Reply to this discussion

Internal reply

Formatting help / Preview (switch to plain text) No formatting (switch to Markdown)

Attaching KB article:

»

Attached Files

You can attach files up to 10MB

If you don't have an account yet, we need to confirm you're human and not a machine trying to post spam.

Keyboard shortcuts

Generic

? Show this help
ESC Blurs the current field

Comment Form

r Focus the comment reply box
^ + ↩ Submit the comment

You can use Command ⌘ instead of Control ^ on Mac