我的页面最初以 4 个包装 div 开始,每个 div 都有一类“col-md-3”,但在单击展开按钮后,隐藏了 3 个包装,点击的包装为“col-md-12” :
// If wrapper is the current wrapper expand to col-md-12 otherwise hide
$(".wrapper").each(function (index) {
if ($(this).attr("id") === wrapper.attr("id")) {
$(this).removeClass("col-md-3").addClass("col-md-12");
} else {
$(this).hide();
}
});
有没有快速/简单的方法来制作这样的动画?我不喜欢将 jQuery UI 库添加到我的元素中。我更喜欢从左向右滑动。
到目前为止我唯一能想到的就是:
$(this).hide('1000');
但是,我更喜欢在添加类“col-md-12”而不是隐藏其他类时制作动画。
最佳答案
I prefer a slide left to right motion.
在 JQuery 中,您可以使用动画元素
$(this).stop().animate({
right: '-50%' //distance of moving
}, 400); //time of moving in ms
关于javascript - 隐藏 3 列并将其中一列扩展为 100% 行时的 jQuery 过渡效果,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/35775019/