在jquery中动画addClass和removeClass

我有一个简单的代码，当单击div时删除类。我正在寻找的是，而不是只显示div点击时，我可以使它从左到右滑动？在jquery中动画addClass和removeClass

$(document).scroll(function() { 
    var y = $(this).scrollTop(); 
    if (y > 140) { 
    $('#primary-menu-container').addClass("hide-nav-fixed"); 
    } else { 
    $('#primary-menu-container').removeClass("hide-nav-fixed"); 
    } 
});

来源

2017-09-21 user38208

[与jquery动画addClass/removeClass]（的可能的复制https://stackoverflow.com /问题/ 7302824 /动画-addclass-removeclass与 - jQuery的） –

只是要叫“滑动左”

.slide-left{ 
    margin-left:-500px; 
    transition:margin-left 500ms; 
}

另一个类，并添加像你与其他类做。然后，在500毫秒后你可以隐藏它。

编辑：您可以按照相同的策略以任何方式移动div。并根据div的CSS的属性，其他属性会更appropiate使动画

来源

2017-09-21 11:56:22 Gerard

这会是你在找什么：

Animate.css

收集简单的CSS动画，你可以的附加到html元素。看看作者在按下按钮时如何链接演示中的动画，并在删除项目之前进行相同操作（在实际删除项目之前设置足够长的计时器）。添加时只需添加一个动画类。

大量的动画似乎适合入门去除列表

您可以自己总是让动画，但为什么要浪费时间，这些都是战斗测试工作。如果你不想让整个包装通过去除你不需要的东西来制作你自己的包装？

来源

2017-09-21 11:57:46 DanteTheSmith

没有CSS3（很老的浏览器版本不兼容），你可以使用jQuery的动画功能，增加课后：

$('#primary-menu-container').animate({"left":"0px"}, "slow");

来源

2017-09-21 12:03:03 GGO

简单的参数添加到您的添加/ removeClass功能是这样的：

.addClass('class-name', time-in-milliseconds, 'effect');

与Swing效果结果1秒：

$(document).scroll(function() { 
    var y = $(this).scrollTop(); 
    if (y > 140) { 
     $('#primary-menu-container').addClass('hide-nav-fixed', 1000, 'swing'); 
    } 
    else { 
     $('#primary-menu-container').removeClass('hide-nav-fixed', 1000, 'swing'); 
    } 
});

这里是文档：

addClass（）http://api.jqueryui.com/addclass/
removeClass（）http://api.jqueryui.com/removeclass/

来源

2017-09-21 12:03:24 Meloman

在jquery中动画addClass和removeClass

回答

相关问题