gpt4 book ai didi

javascript - 无法让 CSS 通过 Javascript 更改类

转载 作者:太空宇宙 更新时间:2023-11-03 21:35:19 25 4
gpt4 key购买 nike

我正在尝试学习网络开发,但一直坚持通过 Javascript 更改 CSS 类。我查看了其他网站和问题,但没有一个对我有用,所以我一定是在做一些我不知道的愚蠢事情。

我试图让它做的是当我悬停时从高度 50 扩展到 200。然而,它什么也没做。

(我知道我可以做一个 :hover,但我需要它在 Javascript 中用于其他需要)

CSS:

.box{
width: 300px;
height: 50px;

-webkit-transition: height 2s ease;
-moz-transition: height 2s ease;
-o-transition: height 2s ease;
transition: height 2s ease;
}

.box-expand{
height: 200px;
}

HTML:

<html>
<head>
<link rel="stylesheet" type="text/css" href="../css/about.css">
<script src="../javascript/preview_control.js"></script>
</head>
<body>
<div class="box">
</body>

Javascript:

var box = document.getElementsByClassName("box")[0];

box.onmouseover = function() {
box.toggleClass("box-expand");
}

最佳答案

我觉得你很接近。 toggleClass() 是一个 jQuery 函数,classList.toggle 用于 vanilla JavaScript。

box.onmouseover = function() {  
box.classList.toggle("box-expand");
}

关于javascript - 无法让 CSS 通过 Javascript 更改类,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/27050999/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com