I am trying to enable the bootstrap tooltips in Gantry 4.
The bootstrap javascript is loaded, as bootstrap.min.js as is jquery.
I added the following to the index.php file just before the closing body tag
<script type="text/javascript">
$(document).ready(function () {
$("[rel=tooltip]").tooltip();
});
</script>
I seem to have a conflict as I get the following error:
TypeError: 'undefined' is not a function (evaluating '$(document).ready(function () {
$("[rel=tooltip]").tooltip();
})')
The text that is supposed to trigger the tooltip is:
<a href="#" rel="tooltip" data-placement="top" data-original-title="Depuis le 1er juin 2004, la durée légale de la vie séparée a été réduite de quatre à deux ans.">le cas d’un mariage de longue durée</a>
Can someone please point out what I need to do to resolve this? Thanks.
Sorry, I forgot to add the link to the site and page where the tooltip is not functioning.
http://gobet.ergonomiq.net/divorce-séparation/divorce/26-requérir-seul-le-divorce-après-deux-ans-de-séparation#
You have MooTools active on the website, so the $ selector doesn't work like it would if jQuery were the primary $ selector agent. You'll need to convert the uses of $ where jQuery is expected to use jQuery instead.
Example:
$(selector here)
should be:
jQuery(selector here)
And everything else will work fine.