jquery按钮淡出与背景图像行事奇怪

我想通过使用toggleClass方法使一个按钮淡入另一个类。这似乎工作正常，直到我将类背景图像引入。jquery按钮淡出与背景图像行事奇怪

我甚至不确定它在做什么。它似乎取决于鼠标在按钮上的位置。无论如何，按钮排序开始淡化，可能只是背景颜色而不是图像，然后在完成动画后在背景中“弹出”。我在这里重现它：

所以我的问题是..我怎样才能使整个事情褪色？

2012-03-05 Sackling

我认为这是类似于：http://stackoverflow.com/questions/808790/jquery-fade-background-on-hover - 你试图淡出背景 – JMax 2012-03-05 15:08:58

它被认为是好的形式（并会让你高高质量的答案），以便在问题中提供代码，而不仅仅是在小提琴外部。格式化以提高可读性在这两个地方也是受欢迎的（即不仅仅是长单行CSS块） – 2012-03-05 15:14:59

抱歉，不知道在这里发布代码以及..我认为这两者之一。我将编辑该问题。我也会删除不必要的CSS。 – Sackling 2012-03-05 15:16:51

你不能在类之间真的淡入淡出。一个元素有一个类，或者它没有。

2012-03-05 15:08:36

我不认为这会很难写。它现在不是它的工作方式，我也不认为它应该如何工作。 – 2012-03-05 15:15:35

我实际上已经在使用jQuery UI了，所以我试过了toggleClass，结果也是一样。 – Sackling 2012-03-05 15:24:27

是的，我误解了您的原始问题;我删除了我以前的评论，因为他们在这方面没有意义。 toggleClass实际上应该（根据文档）做到这一点，但是当你转换这些很多样式时，其中许多都带有供应商前缀，我不惊讶它失败。 – 2012-03-05 15:27:08

而不是尝试切换类，只需切换该类的属性。假设你没有做太多疯狂的事情，那应该很简单。

2012-03-05 15:26:32

你不能没有color plugin

2012-03-05 15:31:47

动画颜色值是的，你可以不褪色成类，但有可能一招

$('button').on("mouseenter",function(){ 
    $(this).fadeOut(100).toggleClass("ui-state-hover").fadeIn(100); 
});

这里是一个demo。基本上，这个想法是淡出，然后切换课程并再次显示。

检查this演示假背景，当按钮淡出和英寸我希望你会做这些演示你想要的。

2012-03-05 15:37:47 Starx

这种有点sorta工程..但不够好..它必须完全淡出之前开始淡入，所以它看起来像是“闪烁”一瞬间。 – Sackling 2012-03-05 15:45:55

哇，不够好。你在听我的老板。主席先生，我不适合你。但我很酷，你可以随时添加背景图片来伪造它。我将创建一个小提示向您展示。 – Starx 2012-03-05 15:53:15

@Sackling，检查更新，你可以从上面的代码中删除'100'并用'0'替换，如果你不想闪烁直接来。 – Starx 2012-03-05 15:58:30

回答