1
嗨我正在研究svg base map,其中我突出顯示了一些特定位置,當用戶鼠標懸停在它上面時,它彈出位置名稱以及顏色變化,現在我的客戶端需要使用投影效果,當用戶鼠標懸停在它上面時,它的顏色變化以及投影效果。 這是我的代碼。當鼠標懸停在css上時,如何在svg base map上應用陰影
SVG的代碼
<path id="Middle East Region" class="enabled" fill="#21669E" stroke="#FFFFFF" stroke-width="0.75" d=""</path>
<script>
$description = $(".description");
$('.enabled').hover(function() {
$(this).attr("class", "enabled heyo");
$description.addClass('active');
$description.html($(this).attr('id'));
}, function() {
$description.removeClass('active');
});
$(document).on('mousemove', function(e){
$description.css({
left: e.pageX,
top: e.pageY - 70
});
});
</script>
這裏是CSS
.heyo:hover {
fill: #CC2929;
-moz-transition: 0.3s;
-o-transition: 0.3s;
-webkit-transition: 0.3s;
transition: 0.3s;
}
你指的是這樣的[** **的jsfiddle(https://jsfiddle.net/vivekkupadhyay/qmrz3kjp)? – vivekkupadhyay