Tour stops on right side of screen not positioning as expected

[agentfitz]

I have noticed that tour stops on the right side of the screen do not automatically adjust their position to stay within the layout (and instead push off the right side of the screen and generate a horizontal scrollbar).

This issue can be seen on the main joyride page: http://zurb.com/playground/jquery-joyride-feature-tour-plugin

If you size your browser window down to nearly the size of the layout (approximately 1000px), you will notice that when you arrive at step 4 (the download step), since it is in the right sidebar in the layout, the tip does not automatically position itself as expected and instead generates a horizontal scrollbar.

[btm1]

i second this. i came up with a jank solution for my own purposes but I'd like it if this were fixed:

$(window).resize(adjustDelay);

  function adjust() {
    var w = $(window).width();
    var ele = $('.joyride-tip-guide:visible');
    var offset = ele.offset();
    var right = offset.left + ele.width();
    var overflowed = right > w;

    if(overflowed) {
      var diff = right - w;
      var left = parseInt(ele.css('left')) - diff;
      var nub = ele.find('.joyride-nub');
      console.log(diff);
      console.log(left);
      ele.css('left',left);
      nub.css('left',diff + 22);
    }
  }

  function adjustDelay() {
    $timeout(function(){
      adjust();
    },200);
  }

  $('body').on('mousedown','.joyride-next-tip',adjustDelay);

[itsmattsoria]

I can also confirm this issue. For a visual reference to the example @agentfitz pointed out on the Zurb page:

[whughes98144]

Aaaaannnnd, it's still an issue. Try pointing to an element in the topbar at right. But btm1, not bad! Yes, definitely an issue in the zurb playground tour, esp around 775px, just before it goes 1 column. Then it completely misplaces the nubs.