На данном сайте реализована интерактивная возможность по клику на блоки с надписями "территории опережающего развития" и т.д, создавать всплывающие блоки над элементами svg.
Блоки создаются и меняются по клику, но не скролятся вместе с картой.
Как можно решить проблемы скрола? Они должны следовать за картой.
JS который создает блоки:
(function($) {
$('.capabilities-wrapp .capabilities-caption').click(function() {
$('.tooltip').remove();
$('.stat-capabilites_map path.cls-3').each(function(e) {
$('body').prepend('<div class="sss" id="sss'+e+'"></div>');
$("#sss"+e).html($(this).attr('title')).css({"top":$(this).offset().top, "left":$(this).offset().left});
})
});
})(jQuery);
CSS всплывающего блока:
.sss {
position: absolute;
z-index: 100;
}