jquery - 切换时 Div 褪色背景

Question

同一页面中有两个 div，其中一个是隐藏的，并在使用 jQuery 单击按钮时与另一个 div 切换。

是否可以为隐藏的 div 提供“淡入”效果，这样当两个 div 切换时，新 div 的背景颜色会在 2-3 秒内“淡化”为透明以突出显示新 div？

对不起，一些不正确的英语。

谢谢。

Answer 1

您可以使用：

$("#element").fadeOut(2000);
$("#element2").fadeIn(2000);

.fadeOut() API 文档
.fadeIn() API 文档

Answer 2

淡入后使用 jQuery UI 的 .effect() 函数突出显示第二个 div 怎么样？

第一个 div 淡出，然后第二个淡入并突出显示 3 秒。

$('#div1').fadeOut(500, function () {
    $('#div2').fadeIn(500, function () {
        $('#div2').effect('highlight', {}, 3000);
    });
});

请参阅：http ://docs.jquery.com/UI/Effects/Highlight

Answer 3

试试：http: //jsfiddle.net/8mEL4/

$(function () {
   $("#element1").fadeOut( { duration: 1000, queue: false });
   $('#element2').effect('highlight',{ duration: 1000, queue: false });
});

我设置queue : false了同步动画效果并使用jQuery UI/Effects/Highlight来突出显示效果。