Как поменять background page из центра страницы?

Question

[HelenChydilove]

Всем привет!
Идея такая, в центре круг, круг вырастает, заполняет весь фон страницы и становиться фоном страницы
https://codepen.io/LenaBoro/pen/NwyqZK
как поменять так фон?

Answer 1

[Denis Popov]

$('body').css('background','#ccc');

Comments

[HelenChydilove]

это вариант хорош, но не подходит так ,как нужно поменять фон через круг в центре . Круг расширяется до размеров страницы и становится фоном

[Denis Popov]

в колбэк функции по завершению анимации поменяй фон как я написал. почитай про animate, там можно колбэк функции прописывать последним параметром.

что-то типа

setTimeout(big, 1000);
  
 function big() { 
   $('.circle').animate({
       width: '250px',
       height: '250px',
       left: "45%",
       top:'25%'},function(){
      $('body').css('background','#ccc');
})
  }

и до анимации наверно у родителя прописать overflow:hidden надо.
а после анимации вернуть на overflow: auto;

Answer 2

[Александр Зачиналов]

вы можете анимировать смену цвета фона параллельно увеличению размера, если я правильно понял: https://codepen.io/anon/pen/YEeyvb