jQuery 图片高亮显示

主要的jQuery代码：

 $(function() {
            $("ul li").hover(function() {
                // over
                //鼠标移入当前列透明度为1 其他列为0.5
                $(this).css("opaacity", "1").siblings("li").addClass("opacity_li");

            }, function() {
                // out
                //鼠标移出的时候把其他列透明度去掉
                $(this).siblings().removeClass("opacity_li");
            });
        })

html代码：

<ul>
        <li>
            <a href="#"><img src="images/问奈何.png" alt="" /></a>
        </li>
        <li>
            <a href="#"><img src="images/夏承凛.png" alt="" /></a>
        </li>
        <li>
            <a href="#"><img src="images/怀璧明罪问奈何.png" alt="" /></a>
        </li>
    </ul>

css样式：

* {
            margin: 0;
            padding: 0;
        }
        
        ul {
            list-style: none;
            margin: 0 auto;
            width: 608px;
            height: 342px;
        }
        
        img {
            width: 40%;
            height: 40%;
        }
        
        .opacity_li {
            opacity: 0.5;
        }