Introjs Bootstrap Menu Doesn't Work

IntroJS Bootstrap Menu doesn't work

hey man make sure your jquery link placed first then write javascript link

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></class="hljs-name">script>

<script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>

Bootstrap IntroJS step number not aligned correctly in Bootstrap 3

Updating the introjs.css to widen the circle a bit and drop the padding also fixes the issue (I thought taking the circle to 30px made it look too big):

.introjs-helperNumberLayer {
    padding: 0px;
    width: 25px;
    height: 25px;
}

intro.js - reposition progress bar and put on bottom (beneath steps)

Use absolute positioning on progress element and add a little extra bottom padding to it's parent tooltip for aesthetics.

.introjs-tooltip {
    padding: 10px 10px 14px 10px;
}

.introjs-tooltipbuttons, .introjs-tooltiptext {
    text-align: center;
}

.introjs-progress {
    overflow: hidden;
    position: absolute;
    height: 5px;
    bottom: 0;
    left: 0;
    width: 100%;
    /* margin: 10px 0 5px 0; */
    /* border-radius: 4px; */
    background-color: #ecf0f1;
}

---

Related Topics