I am using bootstrap 4 tooltip and on mobile since tap acts as hover and it doesn't disappear, the tooltip looks weird on page scroll.
So to fix it, I hide the tooltip on page scroll using
$(window).on('scroll', function() {
$('[data-toggle="tooltip"]').tooltip('hide');
});
but the problem is, when I scroll back to the previous position and tap on the toggle, it won't show up. I found the problem that's causing this. It's because the hover for the icon is still not removed so there is still the tooltip. so is there any way we can remove the hover as well from the tooltip toggle so this situation won't occur.
https://jsfiddle.net/gnor914d/5/ here is the fiddle with the scenario.
Please use chrome mobile emulator to see the problem.
Thank you