Simple Javascript Joyride plugin in rails

Question

I\'m afraid my plugin isn\'t working properly because of a misunderstanding of rails. I\'m adding zurbs joyride plugin to an index page.

I have the following in v

Answer 1

Tmacram,

I answered a similar question Here

The original answer was correct about better organization of included files within Rails, but that wasn't causing your issue. The real reason this wasn't working is that Zurb's own instructions for setup are misleading. They say you can use whatever ID you want for your

list that holds the steps of your guided tour, but you actually can't out of the box.

Zurb's code for joyride is dependent upon a specific ID between the CSS/Javascript. This ID and the relevant code is located within the included joyride.css file. The ID used there is "joyRideTipContent." I've pasted the relevant couple lines of code from the joyride.css file (they're near the very top):

#joyRideTipContent { display: none; }
.joyRideTipContent { display: none; }

If you would prefer to use a different ID, simply change the above code in the css file as follows and then it will work (I've included the name from your code snippet above):

#list_index_tour{ display: none; }
.list_index_tour{ display: none; }

Alternatively, you could just change the ID and selector of your

to be "joyRideTipContent" and it would work right out of the box.