Появление контента через увеличивающийся круг внутри блока — как осуществить?

Question

[Денис Букреев]

Вот здесь: dept.drxlr.com
Если проскроллить немного страницу, внизу появится ссылка "See our favorite items"
Нажимаю на нее, появляется красная плашка и из ее центра, в виде расширяющегося круга, появляется контент
Как реализовать такой расширяющийся круг? Он работает наподобие маски в ФШ.

Answer 1

[sergski]

Через инспектор видно как реализовано (clip-path): div с классами .slide.fill при клике получает класс .slide.fill.active и для красоты transition

.slide.fill
webkit-clip-path: circle(0px at center);
-moz-clip-path: circle(0px at center);
-ms-clip-path: circle(0px at center);
clip-path: circle(0px at center);

.slide.fill.active
-webkit-clip-path: circle(150% at center);
-moz-clip-path: circle(150% at center);
-ms-clip-path: circle(150% at center);
clip-path: circle(150% at center);

-webkit-transition: 1s cubic-bezier(0.28, 0, 0.18, 1);
-moz-transition: 1s cubic-bezier(0.28, 0, 0.18, 1);
transition: 1s cubic-bezier(0.28, 0, 0.18, 1);