Position a Popup

[agondek]

Is there any way to position a popup so it is not center of the screen?

[tkawasaki · Accepted solution]

Hello,

I don't think you can specify the position by using the widget's functionality.

showPopup method is used in navigation widget and I don't see any parameters which are for specifying the position of the popup on the screen.

widgetReference.showPopup(mashupName, parameters, popupClosedCallback, parmValueChangedCallback, isModalPopup, popupTitle, fixedPopupWidth, fixedPopupHeight, modalPopupOpacity, false, dialogId, showClose, clickOutsideToClose);

If you use DevTools of your browser application and see Styles applied to Popup element, you can find left and top are applied to it at root_navigation-3-popup level. (the number, in this case 3, between navigation and popup changes depending on your Mashup design)

ThingWorx has Custom CSS feature and you can reference Online Help to understand the usage.

When using Custom CSS, it's expected to give the widget a CustomClass id in the property and set it's style in Custom CSS tab. But when I was fiddling with it I found I can specify something like below and the style is applied to the Mashup.

#root_navigation-3-popup {
    left:40% !important
}

This may not be the designed way to use Custom CSS and this current behavior might be changed in a future release, but if you really need to specify the position of the popup, you can consider the risk and maybe give it a try.

[agondek]

Hi,

Thanks for confirming my thoughts. It would be nice to have parameters to set for the position of the popup via the widget itself. I tested your CSS method and was successful.