<div id="locationDiv" style="color:rgba(0,0,0,0.6);border-radius:10px;left: 98%; top: 25%; border: 1px solid #CCCCCC; position: fixed; width: 100px; margin-left: -100px; heigth: 80px;background:#F5F5F5;"> <div class="hover" style="text-align: center; cursor: pointer; padding-top: 2px;" name="1">xxxx</div> <div class="hover" style="margin-top: 4px; text-align: center; cursor: pointer;" name="2">xxxxx</div> <div class="hover" style="margin-top: 4px; text-align: center; cursor: pointer;" name="3">xxx</div> <div class="hover" style="margin-top: 4px; text-align: center; cursor: pointer;" name="4">xx</div> </div>
2.Css代码
<style type="text/css"> .hover:hover { background: #2B9DEE; border-radius:10px; /* transition: all 0.4s ease-in-out 0s; */ color: rgba(0,0,0,1); } table tr th{ vertical-align:sub; } </style>
3.js代码
jQuery(".hover").mouseover(function(){ jQuery("#locationDiv").css("color","rgba(0,0,0,1)"); }); jQuery(".hover").mouseout(function(){ jQuery("#locationDiv").css("color","rgba(0,0,0,0.6)"); });