Jadi ceritanya tadi nyari-nyari snippet buat nampilin content dari bootstrap popover dan tetep tampil apabila hover on contentnya juga, kira2 begini caranya :
$('.pin').each(function() {
$(this).popover({
html: true,
trigger: 'manual',
placement: 'bottom',
content: function() {
var data = $(this).attr('class');
var tooltip = data.split(" ");
var country = tooltip[2];
return $('dd.'+country).html();
}
}).hover(function() {
if(isVisible & hoverAway) {
$('.popover').hide();
isVisible = false;
hoverAway = false;
}
$(this).popover('show');
isVisible = true;
},function() {
hoverAway = true;
});
});
Intinya sih, tiap kali kita mouseover kasih flag kalo popup sudah tampil dan tiap kali mouseout kasih flag kalo kita sudah hover out dari content dan element html tempat kita hover, kemudian ketika hover di element lain, cek lagi apakah kedua flag tersebut aktif, bila iya maka sembunyikan semua popover yang aktif dan tampilkan popover yg sekarang... gak ngerti maksudnya? ya gpp, saya emang ga bakat bikin penjelasan tertulis... \(^0^)/
$('.pin').each(function() {
$(this).popover({
html: true,
trigger: 'manual',
placement: 'bottom',
content: function() {
var data = $(this).attr('class');
var tooltip = data.split(" ");
var country = tooltip[2];
return $('dd.'+country).html();
}
}).hover(function() {
if(isVisible & hoverAway) {
$('.popover').hide();
isVisible = false;
hoverAway = false;
}
$(this).popover('show');
isVisible = true;
},function() {
hoverAway = true;
});
});
Intinya sih, tiap kali kita mouseover kasih flag kalo popup sudah tampil dan tiap kali mouseout kasih flag kalo kita sudah hover out dari content dan element html tempat kita hover, kemudian ketika hover di element lain, cek lagi apakah kedua flag tersebut aktif, bila iya maka sembunyikan semua popover yang aktif dan tampilkan popover yg sekarang... gak ngerti maksudnya? ya gpp, saya emang ga bakat bikin penjelasan tertulis... \(^0^)/
Comments