我有一个基于列表的图库，其中css使用缩略图链接选择的图库图像隐藏未选择的图像，如下面的代码所示。我使用Jquery'提升缩放'功能放大鼠标悬停时的主要图像，但发现'隐藏'列表元素只是可视的 - 我的js / jquery缩放仍然存在并且只要鼠标结束就弹出其他隐藏的列表元素。我对javascript知之甚少，并且不喜欢蘸到提升缩放功能的数百个代码行。有没有办法将js行为与css联系起来？
CSS：
#gallery {
width: 560px;
overflow: hidden;
height: 430px;}
#gallery-interior li {
width: 560px;
height: 430px;}
HTML：
<div id="gallery">
<ul id="gallery-interior">
<li id="one"><img id="zoom_01" src="../images/normal_1.jpg" data-zoom-image="../images/big_1.jpg"></li>
<li id="two"><img id="zoom_02" src="../images/normal_2.jpg" data-zoom-image="../images/big_2.jpg"></li>
</ul>
<div>
<a href="#one"><img src="../images/thumb_1.jpg"></a>
<a href="#two"><img src="../images/thumb_2.jpg"></a>
</div>