对于那些曾经看过Google plus的人，您一定已经注意到，当您将鼠标悬停在“添加到圈子”按钮上时，系统会自动为您显示div的模态框类型，其中包含复选框中的所有圈子，您只需点击一个你想要的。
有没有一个示例使用css / jquery或类似的方法来做到这一点？
或以某种解释，将如何完成？
最佳答案
这是关于如何做的例子：
<!DOCTYPE HTML>
<html>
<head>
<!-- jQuery -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script>
<script>
var aa;
$(document).ready(function() {
$(".addContainer").mouseenter(function() {
$(".addCircles").animate({height : 200});
});
$(".addContainer").mouseleave(function() {
$(".addCircles").animate({height : 0});
});
$(".addCircles input[type=checkbox]").change(function(e){
alert($(this).attr("id")+": "+($(this).attr("checked") == "checked" ? "checked" : "unchecked"));
});
});
</script>
</head>
<body>
<div class="addContainer" style="position: relative; width: 120px;">
<div class="add" style="cursor: pointer;">Add to Circles</div>
<div class="addCircles" style="height: 0; position: absolute; overflow: hidden;">
<ul style="list-style: none;">
<li><input type="checkbox" id="circle1" />Circle 1</li>
<li><input type="checkbox" id="circle2" />Circle 2</li>
<li><input type="checkbox" id="circle3" />Circle 3</li>
</ul>
</div>
</div>
</body>
</html>