Skip to content

Instantly share code, notes, and snippets.

@hanleybrand
Created May 21, 2012 20:55
Show Gist options
  • Save hanleybrand/2764629 to your computer and use it in GitHub Desktop.
Save hanleybrand/2764629 to your computer and use it in GitHub Desktop.
ZURB Joyride - reset 'count' when tour is finished
/* problem: when ZURB's Joyride tour ends, if the user causes it to run again, the
'count' seems to be messed up
solution: the plugin creates divs with ids in the pattern: 'joyRidePopup' + index
and then iterates through them - running the iteration again recreates the divs &
re-runs and gets confused. So you use postRideCallback (one of the options, see
http://www.zurb.com/playground/jquery-joyride-feature-tour-plugin - step 5 for more info)
to remove those divs when the ride ends
this GIST shows how to bind joyride to a 'HELP' button that will trigger the tour when clicked.
*/
var helpMe = function helpInstance(){
$('div[id^="joyRidePopup"]').remove(); /* in case button is clicked
while tour is running */
$(document).joyride(
{
// add any other option listed at the playground
// http://www.zurb.com/playground/jquery-joyride-feature-tour-plugin
'postRideCallback': function(){
$('div[id^="joyRidePopup"]').remove();
} // a method to call once the tour closes
});
}; //end helpInstance()
$("#help").on('click', helpMe);
@xeroky
Copy link

xeroky commented Jan 7, 2013

Help,

When you enter the website, the tour is successful, but when I run it with the button does not work.

What am I doing wrong?

$(window).load(function() {

$('#GuiaUsuariJoyride').joyride({
    tipAnimation: "fade",
    tipAnimationFadeSpeed: 300,
    cookieName: 'myname',
    cookieDomain: 'mydomain.com'
});

});

$(document).ready(function() {

    $('#icona_ajuda').click(function(){

    $('div[id^="joyRidePopup"]').remove(); /* in case button is clicked
                                              while tour is running  */
    $('#GuiaUsuariJoyride').joyride({
           // add any other option listed at the playground
    'tipAnimation': "fade",
    'tipAnimationFadeSpeed': 300,
    'cookieName': 'myname',
    'cookieDomain': 'mydomain.com',
            'postRideCallback': function(){
                $('div[id^="joyRidePopup"]').remove();
             }       // a method to call once the tour closes
    });
});

}

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment