javascript - Bootstrap tooltip - tooltip function not found -


i'm trying use tooltips in bootstrap when user mouseovers link, text appears. can see how should here: http://getbootstrap.com/javascript/#tooltips

instead, nothing happens when mouseover links. here's html:

                <div class="form-group">                     <label for="test" class="quoteform"><a href="#" data-toggle="tooltip" class="tip-left toollink" data-original-title="this text should appear in tooltip."><i class="fa fa-question-circle"></i></a>test<span aria-required="true" class="required">* <span></span></span></label>                     <select class="form-control quotedetails" id="test">                         <option value="" selected="" disabled="">please select</option>                         <option>1</option>                         <option>2</option>                         <option>3</option>                         <option>4</option>                     </select>                 </div> 

here's js i'm running in header:

<script type="text/javascript">     $(document).ready(function(){         $(".tip-top").tooltip({             placement : 'top'         });         $(".tip-right").tooltip({             placement : 'right'         });         $(".tip-bottom").tooltip({             placement : 'bottom'         });         $(".tip-left").tooltip({             placement : 'left'         });     }); 

when run page, error: typeerror: $(...).tooltip not function. thought might because had incorrectly linked jquery , bootstrap.min.js, can navigate both of them , fine. additionally, tried replacing both of them links respective cdn's made no difference.

here js files i'm linking to:

<!-- scripts -->     <script src="/js/plugins/jquery.1.11.0.js"></script>     <script src="/js/plugins/bootstrap.min.js"></script>     <script src="/js/plugins/bootstrap-dialog.min.js"></script>     <script src="/js/owl.carousel.js"></script>     <script src="/js/custom.js"></script>     <script src="/js/validate.js"></script>     <script src="/js/plugins/sticky-tabs.min.js"></script>     <script src="/js/plugins/jquery.select2list.min.js"></script> 

add js tooltip

https://jsfiddle.net/skaadel/ewscg13g/

tooltip js

$(function () {   $('[data-toggle="tooltip"]').tooltip() }) 

Comments

Popular posts from this blog

html - Outlook 2010 Anchor (url/address/link) -

javascript - Why does running this loop 9 times take 100x longer than running it 8 times? -

Getting gateway time-out Rails app with Nginx + Puma running on Digital Ocean -