Any tips on how to get this popover to stay on the screen?
I have a little pop over box where users can select another color , but if it 's on the edge it goes off the screen . Any tips to make it more dynamic and adjust it 's position if it can 't show fully on the screen ? Here 's a demo : https://guides.darrenalderman.com/recordings/F10mlY8Uzz2hIPR7S0a0 β 1Hey , Darren . I had the same problem myself when working on text highlighting last year . In my case , I was using the Selection API to get the client bounding rect , which returns the x and y position , so used that to calculate where it should be (in a custom action ) , but you might be able to do something different without a custom action . For example , assuming the list of options in your tracker are an array , you could do a check to see if the element clicked is either the first or last one in the array and than have apply a class that shifts it left or right using translate . For example If Last item in array, class evaluates to true, translate by -50% or something like that ? @Tom Ireland Perfecto ! Thanks for the direction . This list will always have 7 items and a fixed width (for now ) so I was able to use that to my advantage . I used the list position and some logic +math to determine how much to translate and it looks great ! Solution Walkthrough : https://guides.darrenalderman.com/recordings/4sO3pWFqL8Hxf7sBX7g3 π2
