Question

我有以下jQuery

$(".dropdown-menu-1").click(function() {
  $(".submenu-1").toggleClass("visible").removeClass(function() {
    $(".submenu-2").removeClass("visible"),
    $(".submenu-3").removeClass("visible");
  });
}),
$(".dropdown-menu-2").click(function() {
  $(".submenu-2").toggleClass("visible").fadeIn().removeClass(function() {
    $(".submenu-1").removeClass("visible"),
    $(".submenu-3").removeClass("visible");
  });
}),
$(".dropdown-menu-3").click(function() {
  $(".submenu-3").toggleClass("visible").removeClass(function() {
    $(".submenu-1").removeClass("visible"),
    $(".submenu-2").removeClass("visible");
  });
})

问题是，如何淡化那些toggleClass-events？你可能会看到我用＆＃34; fadeIn（）＆＃34;但这只会导致一个错误，所以我可能会在这里遗漏一些东西。

Theres a＆＃34;可能重复＆＃34;我的问题，说明使用jQueryUI，我做了。这还没有解决我的问题。元素现在只需要更多时间就可以看到，但没有褪色动画。

你们中有谁对此有所了解吗？

谢谢！

Answer 1

你可以使用animate jquery函数...它更高级...但我认为你可能会改变代码的逻辑... 这是jquery函数的文档 http://api.jquery.com/animate/ 您可以使用animate函数，如下面的代码：

 $("#sliding_div1").animate({ paddingTop: '300px'},200);

animate函数有很多属性，请参阅文档

Answer 2

您在.visible课程中是否有特定的CSS规则？这应该足以满足您的需求：

$(".dropdown-menu-1").click(function() {
    $(".visible").fadeOut().removeClass("visible");
    $(".submenu-1").fadeIn().addClass("visible");
});
...

我如何淡化切换事件？

2 个答案: