我有一个垂直的图像列表，悬停时它会显示一个包含 3-5 个以上图像的子菜单，这些图像是指向其他页面的链接。一切都很好；但是，如果我滚动远离页面顶部的任何位置并将鼠标悬停在列表项上，那么子菜单列表项不会像我不这样做时那样直接平行于主列表滚动并最初将鼠标悬停在列表上，子菜单直接正确显示在列表中的父项旁边。这只是一个 CSS 列表。
向下滚动后，我有两张好视图和坏视图的图像。
有任何想法吗？谢谢！
工作截图，页面未滚动
屏幕截图无效，页面滚动
HTML
<div id="navcontainer">
<ul>
<li><img src="graphics/nav_main_data_files.jpg" alt="">
<ul class="nested">
<li><a href="datauploaddatafiles.aspx"><img src="graphics/nav_sub_upload_data_file.jpg" alt=""></a></li>
<li><a href="datarequestsamples.aspx"><img src="graphics/nav_sub_request_samples.jpg" alt=""></a></li>
<li><a href="dataapprovesamples.aspx"><img src="graphics/nav_sub_approve_samples_data.jpg" alt=""></a></li>
</ul>
<li><img src="graphics/nav_main_job_tracking.jpg" alt="">
<ul class="nested">
<li><a href="jobtrackingschedule.aspx"> <img src="graphics/nav_sub_schedule_job.jpg" alt=""></a></li>
<li><a href="jobtrackingsviewstatus.aspx"><img src="graphics/nav_sub_view_job_status.jpg" alt=""></a></li>
<li><a href="jobtrackingsreviewproductiontotals.aspx"><img src="graphics/nav_sub_review_prod_totals.jpg" alt=""></a></li>
</ul>
</li>
</ul>
</div>
CSS
#navcontainer ul { list-style-type: none; }
.nested
{
display: none;
list-style: none;
}
li:hover > .nested
{
display: inline-block;
position: fixed;
padding-left: .5em;
}