使用带有淡入淡出的 jQuery .hide()
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/16165008/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Using jQuery .hide() with fading
提问by Francesca
I have a .hide()function that hides divs based on checkboxes.
我有一个.hide()基于复选框隐藏 div的功能。
JS Fiddle of it working hereReal site example here
JS Fiddle of it work here Real site example here
I'm trying to give it animation so that the .hide()will fade in/out rather than just disappear.
我试图给它动画，以便它.hide()会淡入/淡出而不是消失。
Tried utilising the jQuery Fade function but as a parameter for .hide()but doesn't seem to work
尝试使用 jQuery Fade 函数但作为参数.hide()但似乎不起作用
$("div").click(function () {
$(this).hide("fade", {}, 1000);
});
I tried using this in my code (see JS Fiddle) as the following:
我尝试在我的代码中使用它（参见 JS Fiddle），如下所示：
if(allSelected.length > 0){
$("div.prodGrid > div:not(" + allSelected + ")").hide("fade", {}, 1000);
}
Where am I going wrong?
我哪里错了？
回答by Arnelle Balane
$("div").click(function () {
$(this).fadeOut(1000);
})
There are also fadeInand fadeToggle.
还有fadeIn和fadeToggle。
回答by codefreak
You might use @Arnelle's solution if you want to fadeOut or
如果您想淡出或
replace $(this).hide("fade", {}, 1000);with
替换$(this).hide("fade", {}, 1000);为
$(this).hide("slow");//or $(this).hide(1000);
passing "slow" will give a nice animation before hiding your div.
在隐藏你的 div 之前，传递“慢”会给出一个很好的动画。
Modified your fiddle with changes: http://jsfiddle.net/Z9ZVk/8/
通过更改修改了您的小提琴：http: //jsfiddle.net/Z9ZVk/8/
回答by Milind Anantwar
Try using fadeoutwith duration instead of using hide.
尝试使用fadeoutwith duration 而不是使用 hide。
if(allSelected.length > 0){
$("div.prodGrid > div:not(" + allSelected + ")").fadeOut(1000);
}
回答by Bharath Kumaar
I have tried the code in the below link, Its working fine.
我已经尝试了下面链接中的代码，它工作正常。
Using jQuery .hide() and .show() with fading - Live Demo
使用带有淡入淡出效果的 jQuery .hide() 和 .show() - 现场演示
$("#btnHideShow").click(function () {
if ($("#btnHideShow").val() == "Hide") {
$("#imgHideShow").hide(1000);
$("#btnHideShow").attr("value", "Show");
}
else {
$("#imgHideShow").show(1000);
$("#btnHideShow").attr("value", "Hide");
}
});
You can also find fadeIn,fadeOut,slideUp and slideDownUsing Jquery from thebelow link.
您还可以从下面的链接中使用 Jquery找到淡入、淡出、滑动和滑动。
