# Footer position

**URL:** <https://forum.readymag.com/t/footer-position/204>\
**Category:** Animations\
**Created:** [April 24, 2022, 4:10pm UTC](https://forum.readymag.com/t/footer-position/204 "2022-04-24T16:10:37Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![19\_84](https://sea1.discourse-cdn.com/flex015/user_avatar/forum.readymag.com/19_84/32/1283_2.png) [@19\_84](https://forum.readymag.com/u/19_84)\
**Post date:** [April 24, 2022, 4:10pm UTC](https://forum.readymag.com/t/footer-position/204/1 "2022-04-24T16:10:37Z")

</div>

Hey everyone.

Does anybody know how to position this shape mask: [https://from.cm/](https://from.cm/) ?

I see it’s fixed by browser window (and you see it while scrolling), but how can I push this mask to the footer? I need it stops strictly till the footer and don’t overlay it.

Thanks.

 ![Снимок экрана 2022-04-24 в 19.04.48](https://us1.discourse-cdn.com/flex015/uploads/readymag/original/1X/755dd438c2bc598b2257b1bd794e0c3870a37638.png)

---

<div class="post-metadata">

**Author:** ![HEADLESS.HORSE](https://sea1.discourse-cdn.com/flex015/user_avatar/forum.readymag.com/headless.horse/32/144_2.png) [@HEADLESS.HORSE](https://forum.readymag.com/u/HEADLESS.HORSE)\
**Post date:** [April 24, 2022, 6:58pm UTC](https://forum.readymag.com/t/footer-position/204/2 "2022-04-24T18:58:21Z")

</div>

Hi there @19_84, just trying to understand the request. Is it to replicate this effect?

In which case it looks like they’ve used an animation state ‘on scroll’. I’ve attached a test page + screenshot of how this was done.

> **[Fixed Position On Scroll](https://dev.headless.horse/On-Scroll)**

 ![](https://us1.discourse-cdn.com/flex015/uploads/readymag/original/1X/a9b3f6818c81d2cbef85bc9a47263fc489b37785.jpeg)

---

<div class="post-metadata">

**Author:** ![Linux](https://sea1.discourse-cdn.com/flex015/user_avatar/forum.readymag.com/linux/32/90_2.png) [@Linux](https://forum.readymag.com/u/Linux)\
**Post date:** [April 27, 2022, 3:10pm UTC](https://forum.readymag.com/t/footer-position/204/3 "2022-04-27T15:10:31Z")

</div>

hey, hi @19_84 .  
We’ve designed and developed the website you mention in the example 😃

As @HEADLESS.HORSE just say we used an animation on scroll for the “big logo shape”.

hope it’s clear, feel free to ask anything  
best

---

<div class="post-metadata">

**Author:** ![19\_84](https://sea1.discourse-cdn.com/flex015/user_avatar/forum.readymag.com/19_84/32/1283_2.png) [@19\_84](https://forum.readymag.com/u/19_84)\
**Post date:** [April 27, 2022, 3:36pm UTC](https://forum.readymag.com/t/footer-position/204/4 "2022-04-27T15:36:43Z")

</div>

Thanks for the answer. I have already figured it out.
