Зміна прозорості через властивість display (block/none)

.fadeOut(швидкість,функція) - сховає всі об'єкти, що попали у вибірку, в дужках може зазначатися час виконання, лінійність та функція, яка виконується після події
.fadeIn(швидкість,функція) - покаже всі об'єкти, що попали у вибірку, в дужках може зазначатися час виконання, лінійність та функція, яка виконується після події
.fadeTo(швидкість,прозорість,функція) - для всіх об'єктів, що попали у вибірку буде змінено прозорість за вказаний час до вказаного рівня (від 0 до 1), в дужках може зазначатися функція, яка виконується після події

Приклади

Cховає всі об'єкти, що попали у вибірку, в дужках може зазначатися час виконання, лінійність та функція, яка виконується після події

Замість числового значення можна вказати 'fast' (200 мсек) або 'slow' (600 мсек), тривалість за умовчанням 0,4 сек (400 мсек). Зазначивши 'swing' або 'linear' можливо встановити зникнення з прискоренням або лінійне відповідно

$("#btn1").click(function() {
         $('#fo div:first').fadeOut(6000,'swing');
         $('#fo div:last').fadeOut(6000,'linear');
});
 

Покаже всі об'єкти, що попали у вибірку, в дужках може зазначатися час виконання, лінійність та функція, яка виконується після події

$("#btn2").click(function() {
       $('#fi div:first').fadeIn(6000,'swing',function(){
                 $(this).css('border','3px solid red');
            });
        $('#fi div:last').fadeIn(6000,function(){
                 $(this).css('border','3px solid blue');
            });     
});

Для всіх об'єктів, що попали у вибірку буде змінено прозорість за вказаний час до вказаного рівня (від 0 до 1), в дужках може зазначатися функція, яка виконується після події

Використання ефекту fadeTo() встановлює сss властивість display:block, не впливає на visibility і змінює opacity.

$("#btn3").click(function() {
         $('#ft div:first').fadeTo(3000,0.8);
          $('#ft div:last').fadeTo(3000,0.5,function(){
                 $(this).css('border','3px solid blue');
            });     
});