0

I have two buttons (images with anchors): "Download from Google Play" and "Download from App Store" (You know these badges from all the apps). However, he wants them to be sticked to bottom, but when you reach the footer they should stay in their normal position, I'll show two images in order to make you understand us.

Normally, I tried position: fixed and bottom: 0, but this would make it stay sticked to the bottom even when the footer is in the viewport. For any clue, you can even visit http://umfa.woobble.com/index.php/umfa to see the live website.

These are the states he want:

IMAGE1: Fixed at bottom (with some spacing that I can take care of)

IMAGE2: Is not fixed anymore, but instead it is in it's normal place

enter image description here

enter image description here

Temani Afif
  • 245,468
  • 26
  • 309
  • 415
Eduard Stefan
  • 59
  • 7
  • You will have to look into `.scrollTop` function. This answer may help: https://stackoverflow.com/questions/8644248/fix-div-when-browser-scrolls-to-it – Anurag Srivastava Mar 04 '19 at 07:15
  • you can do this with js, try looking it to Intersection Observer https://developer.mozilla.org/en-US/docs/Web/API/Intersection_Observer_API – MennyMez Mar 04 '19 at 08:39
  • [Scroll-Then-Fix Content](https://css-tricks.com/scroll-fix-content/). – Erik Philips Mar 04 '19 at 08:45

1 Answers1

0

You can try it by position:sticky

tinwan
  • 307
  • 1
  • 4