Javascript 移除：使用toggleClass缩放对象后的悬停效果

我不知道做这件事的最好方法是什么，或者怎么做，所以任何事情都能帮上忙

$(document).ready(function() {
        $("#button").click(function() {
            $('.logo').toggleClass('logo-active');
        });
        $("#button").click(function() {
            $('.text').toggleClass('text-active');
        });});

---

我有这段代码，我想删除：悬停效果，当框被缩放到大并且文本出现时。所以当激活.logo active时，：hover应该被禁用。提前感谢您。

您的徽标的初始比例为0.8，因此将其添加到css代码的底部将起作用（在您的JSFIDLE上测试）

---

您可以创建一个额外的类并切换它

$(document).ready(function() {

        $("#button").click(function() {
            $('.logo').toggleClass('logo-active');
            $('.logo').toggleClass('logo_hover')

        });
        $("#button").click(function() {
            $('.text').toggleClass('text-active');
        });
});


.logo_hover:hover {
  transform: scale(1.0);
  cursor: pointer;
}


<div id="button" class="logo logo_hover">
    <p class="text">Hello / Hi</p>
</div>

$（文档）.ready（函数（）{
$（“#按钮”）。单击（函数（）{
$（'.logo'）.toggleClass（'logo-active'）；
$（'.logo'）.toggleClass（'logo_hover'））
});
$（“#按钮”）。单击（函数（）{
$（'.text'）.toggleClass（'text-active'）；
});
});
.logo_hover:悬停{
变换：比例（1.0）；
光标：指针；
}
你好/你好

参见JSFIDLE:

添加

转换：比例（1.0）至
。徽标处于活动状态


$（文档）.ready（函数（）{
$（“#按钮”）。单击（函数（）{
$（'.logo'）.toggleClass（'logo-active'）；
});
$（“#按钮”）。单击（函数（）{
$（'.text'）.toggleClass（'text-active'）；
});
});
.logo{
背景：蓝色；
宽度：100px；
高度：100px；
利润上限：-50px；
左边距：-50px；
位置：绝对位置；
左：50%；
最高：50%；
变换：比例（0.8）；
过渡：所有0.5s缓解；
}
.徽标：悬停{
变换：比例（1.0）；
光标：指针；
}
.标志激活{
背景颜色：蓝色；
宽度：200px；
高度：200px；
利润上限：-100px；
左边距：-100px；
位置：绝对位置；
左：50%；
最高：50%；
变换：比例（1.0）；
}
.文本{
不透明度：0；
过渡：所有0.5s缓解；
}
.文本激活{
利润上限：-50px；
不透明度：1.0；
}

你好/你好
谢谢。与另一个一样简单，但不缩放文本！您只需添加
transform:scale（1.0）到
。文本也到
。
$(document).ready(function() {

        $("#button").click(function() {
            $('.logo').toggleClass('logo-active');
            $('.logo').toggleClass('logo_hover')

        });
        $("#button").click(function() {
            $('.text').toggleClass('text-active');
        });
});


.logo_hover:hover {
  transform: scale(1.0);
  cursor: pointer;
}


<div id="button" class="logo logo_hover">
    <p class="text">Hello / Hi</p>
</div>