Tetiana
Tetiana

Reputation: 83

Jquery mobile popup is being reopened in wrong position on page resizing or scrolling

In PC browser there is a problem that popup changes its position on window resizing. I googled it and found that JMF has a bug changing positionTo from origin/#codeSource to window.

In mobile browser I have the same issue on page scrolling. Popup is rendered again in wrong position.

I need either to set somehow correct position or to avoid multitime reopening on window resizing and page scrolling.

Could somebody give me a piece of advice?

Upvotes: 2

Views: 857

Answers (1)

Omar
Omar

Reputation: 31732

You need to listen to popupbeforeposition event and alter ui object which that event omits. The object holds three properties which define popup's position, ui.x, ui.y and ui.positionTo.

The default value of the latter property is window, and it overrides any previously added values to ui.x and ui.y. Hence, whenever popupafterposition fires, ui.positionTo should be changed to null instead of window.

Edit: The below code should be wrapped in pageinit event (2).

$(document).on("pageinit", function () {
  $("#popup_ID").on("popupbeforeposition", function (e, ui) {
      ui.x = value; /* (1) */
      ui.y = value; 
      ui.positionTo = null; /* this */
  });
});

Demo

(1) value = number

(2) pageinit is a special jQM event which is equivalent to .ready() and should be used instead of it.

Upvotes: 2

Related Questions