0

Мне нужно применить к блоку одновременно и скольжение вверх и постепенную потерю непрозрачности. Однако, единственный известный мне метод позволяет это делать только последовательно. А как сделать 2 эффекта параллельно?

Известный мне метод )):

$('#g_notif').fadeOut(600).slideUp(600)

1 ответ 1

4

Пример реализации нескольких эффектов параллельно, нужные добавить по вкусу:

    // Произведем изменение нескольких css-величин в ходе одной анимации.
    $("#go").click(function(){
      $("#block").animate({ 
        width: "70%",         // ширина станет 70%
        opacity: 0.4,         // прозрачность будет 40%
        marginLeft: "0.6in",  // отступ от левого края элемента станет равным 6 дюймам
        fontSize: "3em",      // размер шрифта увеличится в 3 раза
        borderWidth: "10px"   // толщина рамки станет 10 пикселей
      }, 1500);               // анимация будет происходить 1,5 секунды
    });
    div { 
      background-color:#bca; 
      width:100px; 
      border:1px solid green;
    }
  
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<button id="go">» Съешь пирожок</button>

<div id="block">Алиса</div>

2
  • а скольжение вверх как добавить (slideUp, который встроенный эффект)? height:0? 6 дек 2018 в 6:15
  • Сделал так: $('#g_notif').animate({opacity:0, height:1},500); Но после анимации блок снова появляется в своих размерах, только прозрачный. А мне надо чтобы исчезал как после slideUp 6 дек 2018 в 6:23

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.