Question

我有一个网页顶部有一个导航栏，当你将鼠标悬停在它上面时，我想通过更改为另一个不同颜色的图像来改变颜色。我想创建一个函数来为这个栏创建HTML代码。我开始了，但我很困惑，从这里开始。

<html>
<head>
    <script LANGUAGE="JavaScript">
        function NavigationBar() {

            var reg1 = new Image
            var red1 = new Image

            reg1.src = "1.gif"
            red1.src = "1R.gif"

            onMouseOver = "document.thereg1.src=red1.src"
            onMouseOut = "document.thereg1.src=reg1.src"
        }
    </script>
</head>

<body>
    <a href="Home Page.html" NavigationBar(thereg1)>
        <img src="1.gif" Name="thereg1">
    </a>
</body>
</html>

Answer 1

您甚至不必使用Javascript

坚持使用CSS，因为它真的很容易，并且这样做：

link {

background-image: url ...
}

link:hover{
background-image: ..
transition : background-image 0.5s ease-in-out;
}

这只会改变悬停时的图像

如果你想要一个很好的过渡使用过渡

使用Javascript制作导航栏

1 个答案: