將鼠標移動到div上，顯示提示信息(div)，並且鼠標移動，顯示的div隨着鼠標的移動而移動，移出div，顯示消失(div)。
{% load staticfiles %}
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>covid-19_US_status</title>
<link rel="stylesheet" href=" {% static 'bootstrap-3.3.7-dist/css/bootstrap.css' %}">
<script src="{% static 'bootstrap-3.3.7-dist/js/jquery.min.js' %}"></script>
<script src="{% static 'bootstrap-3.3.7-dist/js/bootstrap.js' %}"></script>
</head>
<style>
#father{
height:400px;
background-color:green;
}
#click-button{
display:none;
}
#father:hover #click-button{
display:block;
}
</style>
<body>
<div style="height:500px;" id="father">
this is a map
<button type="button" id='click-button' class="btn btn-primary" data-toggle="collapse" data-target="#demo" style="position: absolute">
簡單的可折疊組件
</button>
</div>
<script>
$(document).on('mousemove', function(e){
$('#click-button').css({
left: e.pageX+10,
top: e.pageY+10
});
});
</script>
</body>
</html>