父級元素overflow-y: scroll; 里面的子元素絕對定位被隱藏。
<style> *{ margin: 0; padding: 0; } .side{ float: right; width: 300px; height: 100%; overflow-y: auto; } .item{ position: relative; margin: 10px 0; } .item-hd{ background-color: #ccc; font-size: 14px; line-height: 30px; text-align: center; } .item-bd{ display: none; position: absolute; top:0; right: 280px; width: 300px; height: 200px; background-color: #f00; z-index: 9; } .item:hover .item-bd{ display: block; } </style> <div class="side"> <div style="height:300px;"></div> <div class="box"> <div class="hd">XXXX</div> <div class="bd"> <div class="item"> <div class="item-hd">2333</div> <div class="item-bd"> 666 </div> </div> <div class="item"> <div class="item-hd">2333</div> <div class="item-bd"> 666 </div> </div> <div class="item"> <div class="item-hd">2333</div> <div class="item-bd"> 666 </div> </div> <div class="item"> <div class="item-hd">2333</div> <div class="item-bd"> 666 </div> </div> <div class="item"> <div class="item-hd">2333</div> <div class="item-bd"> 666 </div> </div> <div class="item"> <div class="item-hd">2333</div> <div class="item-bd"> 666 </div> </div> </div> </div><div style="height:800px;"></div> </div>
在線代碼地址：http://runjs.cn/code/x3l82ejf
