javascript - 将鼠标悬停在变化的图像上

Question

我想用 javascript 制作小 slider ，这是我的代码。 HTML:

<div id="slider">
    <div id="thumbs">
        <span id="img1"><img src="Anim/01.png" onmouseover="tofull(1)"></span><br>
        <span id="img2"><img src="Anim/02.png" onmouseover="tofull(2)"></span><br>
        <span id="img3"><img src="Anim/03.png" onmouseover="tofull(3)"></span><br>
        <span id="img4"><img src="Anim/04.png" onmouseover="tofull(4)"></span><br>
        <span id="img5"><img src="Anim/05.png" onmouseover="tofull(5)"></span><br>
        <span id="img6"><img src="Anim/06.png" onmouseover="tofull(6)"></span>
    </div>
    <div id="full">
        <img src="Anim/01.png">
    </div>
</div>

这是我的 JavaScript

function tofull(n){
    switch (tofull){
        case 1:
            document.getElementById("full").innerHTML = "<img src='Anim/01.png'>";
            break;
        case 2:
            document.getElementById("full").innerHTML = "<img src='Anim/02.png'>";
            break;
        case 3:
            document.getElementById("full").innerHTML = "<img src='Anim/03.png'>";
            break;
        case 4:
            document.getElementById("full").innerHTML = "<img src='Anim/04.png'>";
            break;
        case 5:
            document.getElementById("full").innerHTML = "<img src='Anim/05.png'>";
            break;
        case 6:
            document.getElementById("full").innerHTML = "<img src='Anim/06.png'>";
            break;
    }
}

每次我将鼠标悬停在 #thumbs 中的图像上时，都没有任何反应。你能告诉我为什么吗？想法是，如果我将鼠标悬停在 img1 上，我想在 #full 中打印他。

Answer 1

您需要在n上切换。您正在切换toFull

改用switch (n)