0

我已将此 jQuery 规则设置.preloader为不显示

$(".preloader").css("display", "none");

我如何希望它以淡出效果消失，并且在它淡出缩小时，我不知道如何做缩小效果，但我尝试应用它使其淡出

$(".preloader").css("display", "none").fadeOut("200");

这怎么行不通。您能否建议如何实现这两种效果？此外，解决方案会反之亦然吗？（淡入，放大到原来的大小）

4

7 回答 7

3

为了使其淡出，只需使用fadeOut(). 动画的结尾其实就是display: none给元素设置了一个a：

$(".preloader").fadeOut("200");
于 2013-04-10T21:06:56.583 回答
2 
$(".preloader").css("display", "none").fadeOut("200");

此代码首先隐藏 .preloader，然后尝试淡出，这是不可能的，因为它已经隐藏了。

尝试这个：

$(".preloader").fadeOut(200);

或者

$(".preloader").fadeOut("fast");
于 2013-04-10T21:06:35.063 回答
2

$(".preloader").toggle('hide');并且$(".preloader").toggle('show');应该这样做，但$.toggle()如果你不关心display状态是什么，它本身就可以工作。

然而，

$(".preloader").stop(true,false).animate({
    width: 'toggle',
    height: 'toggle',
    opacity: 'toggle'
});

更酷，你只需要一个声明。你也可以使用booleanwith $.toggle(yourShowStateBooleanVariableGoesHere)。

另外，我建议您使用id而不是class选择器，除非它绝对必须应用于所有classes（我觉得很少见）。

于 2013-04-10T21:07:34.373 回答
0 
$(".preloader").hide().fadeIn("200");

$(".preloader").fadeOut("200");
于 2013-04-10T21:07:58.657 回答
0

当淡出效果完成时，它会将显示设置为无，因此您不需要 css 方法。

于 2013-04-10T21:08:24.600 回答
0 
$(document).ready(function(){
    $(".preloader").hover(function(){
        $(".preloader").fadeOut();
    }, function(){
         $(".preloader").fadeIn();   
    });
});

http://jsfiddle.net/BY3tz/8/

这应该会给你一些提示。

于 2013-04-10T21:10:48.800 回答
0

如果您还想缩小，这可能是一个可能的解决方案：

$('.preloader').animate({width: 'toggle', height: 'toggle', opacity: 'toggle'}, 1000);

使用相同的方法将其取回。

看看小提琴。

于 2013-04-10T21:13:42.577 回答