Trip.js icon indicating copy to clipboard operation
Trip.js copied to clipboard

screen-center expose issue

Open Fire-Brand opened this issue 9 years ago • 11 comments

Hi, I have an issue, I want to use the first tripBlock as a screen-center one and I gave it an 'expose:true' , it gave it the nice overlay and everything but when I clicked next, nothing happen… if I click it again it skips over the next tripBlock and goes directly to the 3rd one….. btw pressing the close button on it also required 2 clicks before closing…

i noticed that after the first click(on 'close' or 'next') the tripBlock lost 2 classes: 'animated' and 'fadeIn'.

Here is the code for the 3 first blocks:

  var trip = new Trip([
    { 
       content: '<div class="welcome-block"><h1>Welcome!</h1><img class="welcome-img" src="image/path.png" alt=""/> <p>have fun playing!</p> <p>I know I will</p></div>',
       position: 'screen-center',
       animation: 'fadeIn'
    },
    { 
       sel: $j('#images-tab'),
       content: 'I am the 2nd block.',
       position: 'n',
       expose : true,
       animation: 'bounce'
    },
    {
       sel: $j('#bg-tab'),
       content: 'I am the 3rd block.',
       position: 'n',
       expose : true,
       animation: 'shake'
    }
], {tripTheme : "white",showNavigation: true, showCloseBox: true, enableKeyBinding: false, skipUndefinedTrip: true, delay: -1});

Any ideas?

Thanks in advance

Fire-Brand avatar Aug 31 '14 07:08 Fire-Brand

any thing new about this? maybe a workaround?

Fire-Brand avatar Sep 11 '14 20:09 Fire-Brand

Well, the workaround i was able to do goes like this: in the trip.css i gave the class .trip-overlay a constant display:block

and in a JS file i went and made the .trip-close to change that property back to none like this:

  $('.screen-center .trip-close').on("click",function(){
      $('.trip-overlay').css('display','none');
    });

it lacks the disappearing animation and when I go to next tripBlock and come back there's no overlay but its good eanugh for now...

Hope this would help someone =]

Fire-Brand avatar Sep 14 '14 13:09 Fire-Brand

I just came back from a vacation xD

EragonJ avatar Sep 15 '14 13:09 EragonJ

I may know the root cause and will try to fix this soon. thanks :)

EragonJ avatar Sep 15 '14 15:09 EragonJ

lol, hope you had a good time!

i mannaged to fix the part when i go back to the first center screen from a later tripBlock by doing a global onTripStrat like this:

                  onTripStart: function(tripIndex) {
                      console.log('onTripStart : ', tripIndex);
                      if(tripIndex == 0){
                          $('.trip-overlay').css('display','block');
                      }
                  },

Fire-Brand avatar Sep 15 '14 15:09 Fire-Brand

@Fire-Brand I think this has been fixed, please give it a check with latest version, thanks !!

EragonJ avatar Sep 17 '14 01:09 EragonJ

screen-center still isn't make the overlay disappear when clicking close... i hade to give it display: none; by force...

Fire-Brand avatar Sep 23 '14 07:09 Fire-Brand

@Fire-Brand ?? can you put your full example on jsfiddle and paste the link here ? Thanks

EragonJ avatar Sep 24 '14 09:09 EragonJ

before i'll make a jsfiddle, can you check the usecase? have a screen-center tripblock as the first block, move to the next regular tripblock (n/s/e/w) and return with prev to the screen-center tripblock and now press on the close button...

If that works for you and the overlay disappears, than i'll create the jsfiddle....(alot of work ^^)

Fire-Brand avatar Sep 30 '14 07:09 Fire-Brand

Seeing this bug too.

pkpp1233 avatar Dec 09 '14 17:12 pkpp1233

Seeing this bug too.

hmm, let me reopen this issue and let's see how to fix it. Any information would be helpful :)

EragonJ avatar Dec 11 '14 01:12 EragonJ