Intro

Tour Intro
Show Code

Featured

Special title treatment

With supporting text below as a natural lead-in to additional content.

                  
        <div class="card text-center" data-step="1" data-intro="This is a card">
        <div class="card-header pb-3" data-step="2" data-intro="This is a card header inside a card">
        <h3 class="font-weight-bold">Featured</h3>
        </div>
        <div class="card-body pt-3" data-step="3" data-intro="This is a card body inside a card">
        <h5 class="card-title">Special title treatment</h5>
        <p class="card-text">With supporting text below as a natural lead-in to additional content.</p>
        </div>
        <div class="card-footer pt-3 font-weight-500 text-muted" data-step="4" data-intro="This is a card footer inside a card">
        2 days ago
        </div>
        </div>
        <div class="text-center pt-3">
        <button class="btn btn-primary btn-intro" data-step="5" data-intro="This is a button which control the intro">Start Intro</button>
        </div>
                  
                  
        <!-- Script -->
        <script>
        $('.btn-intro').click(function () {
        introJs().start();
        });
        </script>