currSlide - unavailable on init? or has no height yet

andrnimm's Avatar

andrnimm

04 Oct, 2017 12:28 AM

Hi Dmitry,

I'm having trouble getting the currSlide when the slider initializes.
After changing slides, or on other events, no problem.

I'm using this to move my slider control bar close under the image - sort of like autoScaleSlider, but the slider box stays the same size.
Anyway, maybe that doesn't matter. When I run the function at the end of the initialize function, it seems it doesn't get a currSlide.
When I run the function on rsBeforeAnimStart, it works.

      initializeViewer = function(){
        activeSlider = $(".tab-pane.active .viewerSlider");

        $( activeSlider ).royalSlider({ options etc });

        sliderData = $( activeSlider ).data( 'royalSlider' );

        updateNavPosition = function( sliderData ) {
            
              var currSlide = sliderData.currSlide,
                  img = currSlide.content.find( '.rsImg' ).eq(0),
                  height = img.outerHeight(),
                  thisliderNav = img.closest( '.royalSlider' ).find( '.rsSliderNav' );
                        
              img.attr( 'data-height', height );
              thisliderNav.css( 'top', height );
            
        };

        sliderData.ev.on( 'rsBeforeAnimStart', function( event ) {
              // triggers after slide change
              updateNavPosition( sliderData );
        });

        updateNavPosition( sliderData );

    });

    initializeViewer();
  1. Support Staff 1 Posted by Dmitry Semenov on 04 Oct, 2017 04:54 AM

    Dmitry Semenov's Avatar

    Hello,

    Are you sure that it's currSlide property and not the image itself that is unavailable (because it's pre-loading)?

    Try also listening for rsAfterContentSet, it'll fire after any image is loaded and added to DOM.

    slider.ev.on('rsAfterContentSet', function(e, slideObject) {
    
    });`
    
  2. 2 Posted by andrnimm on 04 Oct, 2017 07:08 AM

    andrnimm's Avatar

    Thanks, I think you were right.

    Before when I used rsAfterContentSet, if i recall correctly currSlide seemed to be getting the slide being lazyloaded into the DOM, two slides ahead, not the current slide.

    But now i'm listening both events, it's definitely getting the first slide correctly, and the later slides. Is it dangerous to listen to both events?

    I ask because now there are some new glitches - I have many sliders on the page, shown/hidden by bootstrap tabs. When I switch between tabs, my slider control bar layout starts to get messed up. (The control bar is created in JS on slider initialize, by reassembling rsGCaption, rsArrows, rsFullscreen and some new elements in a navbar below the slider.) Before listening to the events, there were not these glitches.

    Anyway this is my own JS problem, not your problem. :)

  3. Support Staff 3 Posted by Dmitry Semenov on 04 Oct, 2017 02:40 PM

    Dmitry Semenov's Avatar

    If you make a simple reduced test case with the issue and link to it - I might be able to 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