Javascript 我有悬停效果的问题

我在html中编程了一个按钮，单击时移动，悬停时变小。
但是，单击按钮后，它不再变小。
你知道为什么或者如何修复它吗

$（“#隐藏”）。在（“单击”，函数（）
{
如果（隐藏==0）
{
hide=1；
$（“#Hide”）.css（{“transform”：“translate（-5px，-5px）”}）
}
else if（hide==1）
{
hide=0；
$（“#隐藏”）.css（{“转换”：“转换（0px，0px）”}）
}
});
。按钮{
位置：相对位置；
高度：24px；
保证金：0；
填充：0；
边界：2；
文本对齐：右对齐；
浮动：左；
过渡时间：1s；
}
.按钮：悬停{
变换：比例（0.75）；
}
#隐藏{
宽度：54px；
背景：url（hide.png）；
}

X
这是因为您在CSS和jQuery中使用了两次转换函数，并且只使用了一个-style=“”（使用jQuery添加的）

您可以使用
position:relative移动该按钮；顶部：-5px；左：-5px
而不是
转换：translate（-5px，-5px）

您还可以在单击后切换类并定义4个变换属性：

button {
    transform: scale(1) transform(0,0)
}

button:hover {
    transform: scale(.75) transform(0,0)
}

button.clicked {
    transform: scale(1) transform(-5px,-5px)
}

button.clicked:hover {
    transform: scale(.75) transform(-5px,-5px)
}

在JS中：

$('#Hide').on('click', function() {
    $(this).toggleClass('clicked')
})

您需要将css类
.button
更改为
button
，因为您的文档中没有此类类


$（“#隐藏”）。在（“单击”，函数（）
{
如果（隐藏==0）
{
hide=1；
$（“#Hide”）.css（{“transform”：“translate（-5px，-5px）”}）
}
else if（hide==1）
{
hide=0；
$（“#隐藏”）.css（{“转换”：“转换（0px，0px）”}）
}
});
按钮{
位置：相对位置；
高度：24px；
保证金：0；
填充：0；
边界：2；
文本对齐：右对齐；
浮动：左；
过渡时间：1s；
}
按钮：悬停{
变换：比例（0.75）；
}
#隐藏{
宽度：54px；
背景：url（hide.png）；
}

隐藏按钮
请分享您的问题的小提琴链接好吗？隐藏全球从哪里来？@SifatHaque不需要小提琴或链接。可执行代码可以在问题的这里生成。请添加相关的HTML。