JS写一个把鼠标移到一张图片右边的时候右边的图片会稍微的由小变到原来大小

以下是一个简单的示例代码：

<img id="img1" src="image1.jpg" width="200">
<img id="img2" src="image2.jpg" width="180">

<script>
    var img2 = document.getElementById("img2");
    img2.style.opacity = "0.5"; // 初始时设置为半透明

    document.getElementById("img1").addEventListener("mouseover", function() {
        img2.style.width = "200px"; // 当鼠标移到img1上时，img2恢复到原来大小
        img2.style.opacity = "1";   // 同时设置为不透明
    });

    document.getElementById("img1").addEventListener("mouseout", function() {
        img2.style.width = "180px"; // 当鼠标离开img1时，img2缩小
        img2.style.opacity = "0.5"; // 同时设置为半透明
    });
</script>

这段代码中，我们首先获取了id为img2的图片元素，并将其初始设置为半透明。接着，我们监听了id为img1的图片元素的鼠标移入和移出事件，当鼠标移入时，将img2的宽度设置为原来的大小，并将其不透明度设置为1，表示完全不透明；当鼠标移出时，将img2的宽度缩小，并将其不透明度再次设置为半透明。这样就可以实现我们想要的效果了