I want to show twitter bootstrap tooltip
option when I hover on map marker so I do this:
function createMarker(place){
var placeLoc=place.geometry.location;
var image = 'https://mts.googleapis.com/vt/icon/name=icons/spotlight/spotlight-waypoint-a.png&psize=14&font=fonts/Roboto-Regular.ttf&color=fffa4c38&ax=44&ay=48&scale=1';
marker = new RichMarker({
position: placeLoc,
shadow: 0,
map: map,
content: '<div class="kikonica" data-toggle="tooltip" data-placement="right"><img src='+image+'</img></div>',
});
So my marker is html code with class .kikonica . I try to add tooltip with:
$(function() {
$('.kikonica').tooltop({placement: 'right'});
});
bt dont work. What is problem here? I really dont understand why I cant show tooltip on map-marker hover... please help
At first glance it Looks like you have a typo.
$('.kikonica'). tooltop ({placement: 'right'});
$(function() {
$('.kikonica').tooltip({placement: 'right'});
});
Edit: 1
I think you have to have a title attribute for the tooltip to work.
...
content: '<div title="my tooltip text" class="kikonica" data-toggle="tooltip" data-placement="right"><img src='+image+'</img></div>',
...
Edit 2
// check if .kikonica exists
$(function() {
alert ($('.kikonica').length);
if($('.kikonica').length > 0){
$('.kikonica').tooltip({placement: 'right'});
}
});
Edit 3
setTimeout(function(){
$('.kikonica').tooltip({placement: 'right'});
},50); // increse this value (50) to higher if needed
Edit 4 Use this signature
google.maps.event.addListener(marker, 'mouseover', function() {
$('.kikonica').tooltip({placement: 'right'});
});
A bit late to the party... But I would add the tooltip when the map is fully loaded to ensure correct tooltip behavior. Adding it on mouseover prevents it from displaying the very first hover.
// Add tooltips when map is fully loaded
google.maps.event.addListenerOnce(map, 'idle', function(){
$('.kikonica').tooltip({placement: 'right'});
});
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.