Popup Screen Centering

  • 3
  • Question
  • Updated 4 years ago
  • Answered
Is there a way to control the screen position of a popup?  I have a custom popup with an image, but it always open cutoff on the bottom of the screen...
Photo of Scott

Scott

  • 2,722 Points 2k badge 2x thumb

Posted 4 years ago

  • 3
Photo of Rob Hatch

Rob Hatch, Official Rep

  • 44,006 Points 20k badge 2x thumb
Sorry Scott - there is not currently a way to position the popup.  It is centering on creation, and then pushing the contents down as the page builds. 
Photo of Scott

Scott

  • 2,722 Points 2k badge 2x thumb
no biggie - thanks for the quick response.
Photo of Greg Jarrett

Greg Jarrett

  • 3,496 Points 3k badge 2x thumb
Hi Scott,

not sure if this will help but we had an issue with a large-ish popup opening in the middle of the screen, with the bottom of it falling off the screen. We were looking for a way to make it open at the top of the screen so the full popup would be shown. This other post was a good help - https://community.skuidify.com/skuid/topics/popup_initial_top_value

So we added a Custom Component above the page include and our popup looks like this:



and the Inline (Component) Resource 'topRender' is this:

var element = arguments[0],   $ = skuid.$;

$(document.body).one('pageload',function() {
    element.parents('.ui-dialog').css({'top' : '20px'});
});
Photo of Rob Hatch

Rob Hatch, Official Rep

  • 44,006 Points 20k badge 2x thumb
Ooh - the customer showing the way forward where the official rep said there wasn't one.  How cool is that!   Thanks Greg...  Its nice when you guys teach us stuff! 
Photo of Scott

Scott

  • 2,722 Points 2k badge 2x thumb
nice!  thanks Greg!
Photo of Robin

Robin

  • 894 Points 500 badge 2x thumb
Hi Greg and team, 

Thank you for digging that up and for sharing it here! I for some reason are not able to make it work on my end. Custom inline component is created, the code is an exact copy and paste from your post above, and the component is dropped in at the top of my popup.

Has a more recent Skuid release changed how the code needs to be structured for this to work?

Thank you!

Robin
Photo of Greg Jarrett

Greg Jarrett

  • 3,496 Points 3k badge 2x thumb
Hey Robin, I had noticed that happening myself in newer versions actually. I wouldn't be able to answer your question unfortunately, maybe one of the skuid team could provide some input here.

I think we ended up doing a workaround for popups like this, where we would put everything in the popup inside a fixed height panel set, and allow vertical scrolling for the panel set. So the popup itself would be centred, but could still contain components longer than the screen.