Copy link to clipboard
Copied
Hi! I am making a design and its similar to Apple's. Here is the link: iPad mini Wi‑Fi + Cellular 64GB - Silver - Apple (PH)
as you can see, when you scroll, the image stick UNTIL a certain point (before the What's in the Box section). The problem is, when I make an element in XD, fixed position when scaling, it doesnt stop. I want to make it stop and not stick when I hit a certain part of the page when scrolling similar to that of Apple's. How can I do that? been searching all day and cant find any answer. Thanks!
Hi there,
Thank you for reaching out and using Adobe XD. It looks like you're trying to use the functionality of fixed position. I'd request you to check out this video tutorial: Fixed Position Elements in Adobe XD - YouTube and let me know if this works for you.
Note: Please ignore the position of the Fixed Position option in Design mode, as the team is working on it to update the tutorials.
Thanks,
Harshika
Copy link to clipboard
Copied
Hi there,
Thank you for reaching out and using Adobe XD. It looks like you're trying to use the functionality of fixed position. I'd request you to check out this video tutorial: Fixed Position Elements in Adobe XD - YouTube and let me know if this works for you.
Note: Please ignore the position of the Fixed Position option in Design mode, as the team is working on it to update the tutorials.
Thanks,
Harshika
Copy link to clipboard
Copied
The point she is making is that the fixed element just remains fixed to the page layout, but the user is unable to set a limit as to how far down the page the element may be fixed. Like in this example here: https://codepen.io/jamesdarren/full/ivmcH
When you scroll down the page, the sticky element remains in the same position relative to the viewport, until it hits the bottom "Don't overlap me" page element, and then it scrolls up the page with the rest of the content.
The ask would be to allow your users to set constraints on the fixed element so it doesn't overlap things like the footer (on a web page, for example), or other page elements.
Copy link to clipboard
Copied
I actually just had the same question! I also have a banner at the top of the page, so the "Fixed Position When Scrolling" does not work for me. However if you don't have content at the top, I found that if you do check "Fixed Position When Scrolling" and then have it dissapear behind a layer when you want it to go away (create a white box at the very back) that does work to at least get the point across. The transition is not the best but it works.
Did you discover anything since you last posted this?
Copy link to clipboard
Copied
@HARSHIKA VERMA
Is it possible to release the fixed position on the page at an specific point?
your answer doesn't get the desired result as Kingvlad_Esplana points in the apple ipad example.
I am after the same effect. used fix position until a point where I need to release it.
Thank you!
Copy link to clipboard
Copied
I think what you're looking for is actually a scroll interaction. Feel free to upvote this suggestion - there's also a similar one about "fixed/sticky after scrolling." https://adobexd.uservoice.com/forums/353007/suggestions/12927846