gpt4 book ai didi

css - 仅悬停一次

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

有没有办法让我的 CSS 只经历一次悬停周期?

我需要保持 CSS 完整并添加解决方案而不是完全更改它。

这也许是不可能的,但我想我会问。

CSS:

html .sensitive10, .sensitive5, .sensitive75, .sensitive15, .dp{
opacity: 1.0;
-webkit-transition: 5s all ease-in-out;
-webkit-transition-delay: 60s;
}

html:hover .dp{
opacity: 0.0;
-webkit-transition: all 5s ease-in-out;
-webkit-transition-delay: 16s;
}

#box{
height: 60px;
width: 60px;
background: #0DF;
}

HTML:

<html>
<body>
<div id="box" class="dp"></div>
<body>
</html>

谢谢

最佳答案

你可以用 jQuery .one() 函数做到这一点,这里是引用:

http://api.jquery.com/one/

和相关的例子:

<html lang="en">
<head>
<meta charset="utf-8">
<script src="//code.jquery.com/jquery-1.10.2.js"></script>
</head>
<body>

<div class="count">0</div>
<div class="target">Hover me</div>

<script>
var n = 0;
$(".target").one("mouseenter", function() {
$(".count").html(++n);
});
</script>

</body>
</html>

关于css - 仅悬停一次,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/23278654/

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