Solved

jQuerry Bootstrap Tour not working

Posted on 2013-06-05
1
541 Views
Last Modified: 2013-07-02
Hi guys,

I'm trying to use Bootstrap Tour: https://github.com/Gild/bootstrap-tour/blob/master/README.md

for the following html: http://themeflava.com/rankexperts/userpanel/

I did everything exactly as in the documentation, but it's not working.
I included the js:

<script type="text/javascript" src="js/bootstrap-tour.js" type="text/javascript"></script>
<script type="text/javascript" src="js/bootstrap.js" type="text/javascript"></script>
<script type="text/javascript" src="js/bootstrap.min.js" type="text/javascript"></script>

I pointed the first step to this element:

 <li><a href="projects.html" title=""><img id="step1" src="images/icons/mainnav/projects.png" alt="" /><span>Projects</span></a></li>

I added the tour content:

<ol id="#tourContent">
  <li data-target="step1">Tip content...</li>
</ol>

and the script:

<script type="text/javascript">
  $(window).load(function() {
    $(this).featureTour({
        'cookieMonster': true,           // true/false for whether cookies are used
              'cookieName': 'myHomepageTour',  // choose your own cookie name
             'cookieDomain': false,           // set to false or yoursite.com
              'tipContent': '#tourContent',    // The ID of the <ol> used for content
              'postRideCallback': $.noop,      // A method to call once the tour closes
              'postStepCallback': $.noop,      // A method to call after each step
              'nextOnClose': false,            // If cookies are enabled, increment the current step on close
              'debug': false
    });
  });
</script>

Any ideas how to get this working?
Thanks
0
Comment
Question by:daniel_spiri
1 Comment
 
LVL 53

Accepted Solution

by:
COBOLdinosaur earned 500 total points
Comment Utility
I don't know how significant the 11 HTML validation errors are; certainly the weak doctype contributes to the problem as you probably need HTML5.  The most glaring issue is the excessive number of js files.  With that many and the lack of coherent standards for jquery, it raise the real possibility of a conflict or incompatibility.

Cd&
0

Featured Post

Do You Know the 4 Main Threat Actor Types?

Do you know the main threat actor types? Most attackers fall into one of four categories, each with their own favored tactics, techniques, and procedures.

Join & Write a Comment

Introduction HTML checkboxes provide the perfect way for a web developer to receive client input when the client's options might be none, one or many.  But the PHP code for processing the checkboxes can be confusing at first.  What if a checkbox is…
JavaScript can be used in a browser to change parts of a webpage dynamically. It begins with the following pattern: If condition W is true, do thing X to target Y after event Z. Below are some tips and tricks to help you get started with JavaScript …
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

771 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

10 Experts available now in Live!

Get 1:1 Help Now