1

I am using Zurb-foundation 5 Joyride for a tour guide. It has been pretty helpful. I have a div split into few vertical divs. I was trying to display an info for each vertical div but those tips are coming at the bottom/ top instead of coming at right/ left.

demo

http://codepen.io/chetang/full/pAvmf/

The docs aren't clear on how to achieve it. Any suggestions!!

chetang
  • 198
  • 3
  • 19

1 Answers1

0

You will need to define the location patterns in joyride before using them as shown below.

$(document).foundation({
   joyride : {
   tip_location: 'top',
   nub_position: 'auto',
   tip_location_patterns    : {
   top: ['top'],
   bottom: [], // bottom should not need to be repositioned
   left: ['right', 'top', 'bottom'],
   right: ['left', 'top', 'bottom']
 },
}
});

For more clarity Visit http://codepen.io/Parteek/pen/ohHlc.