diff --git a/lib/rxp-hpp.js b/lib/rxp-hpp.js index f401b88..69ed933 100644 --- a/lib/rxp-hpp.js +++ b/lib/rxp-hpp.js @@ -665,8 +665,14 @@ var RealexHpp = (function () { // check for iframe resize values if (evtdata.iframe) { if (!isMobileNewTab()) { - var iframeWidth = evtdata.iframe.width; - var iframeHeight = evtdata.iframe.height; + // get iframe width as int + var iframeWidth = parseInt(evtdata.iframe.width.replace("px", ""), 10); + // get iframe height as int + var iframeHeight = parseInt(evtdata.iframe.height.replace("px", ""), 10); + // calculate half of iframe width to reuse it + let halfWidth = iframeWidth / 2; + // get iframe top coord + let iframeTop = parseInt(iFrame.style.top.replace('px', ''), 10); var iFrame; var resized = false; @@ -680,9 +686,12 @@ var RealexHpp = (function () { e.instance.events.onResize(evtdata.iframe); } - if (iframeWidth === "390px" && iframeHeight === "440px") { - iFrame.setAttribute("width", iframeWidth); - iFrame.setAttribute("height", iframeHeight); + // if iframe size has changed + if (iFrame.getAttribute('width') !== iframeWidth + 'px' || iFrame.getAttribute('height') !== iframeHeight) { + // calculate maxHeight so that iframe has equal margin at top and bottom if its height exceeds calculated maxHeight -> no need to scroll browser window but light box + let maxHeight = window.innerHeight - (2 * iframeTop); + iFrame.setAttribute("width", iframeWidth + 'px');); + iFrame.setAttribute("height", Math.min(iframeHeight, maxHeight) + 'px'); resized = true; } @@ -700,16 +709,24 @@ var RealexHpp = (function () { overlay.style.overflowY = "scroll"; } } else if (!e.embedded && resized) { - iFrame.style.marginLeft = (parseInt(iframeWidth.replace("px", ""), 10) / 2 * -1) + "px"; + // center iframe horizontally + iFrame.style.marginLeft = -1 * halfWidth + 'px'; + // set maxHeight style to be the same as calculated above + iFrame.style.maxHeight = `calc(100% - ${2 * iframeTop}px)`; } if (!e.embedded && resized) { // wrap the below in a setTimeout to prevent a timing issue on a // cache-miss load - setTimeout(function () { - var closeButton = document.getElementById("rxp-frame-close-" + randomId); - closeButton.style.marginLeft = ((parseInt(iframeWidth.replace("px", ""), 10) / 2) -7) + "px"; - }, 200); + const closeButton = document.getElementById("rxp-frame-close-" + randomId); + if (closeButton) { + // set margin immediately if closeButton is present + closeButton.style.marginLeft = halfWidth - closeButton.width / 2 + 'px'; + } else { + setTimeout(function () { + closeButton.style.marginLeft = halfWidth - closeButton.width / 2 + 'px'; + }, 200); + } } } } else { @@ -1012,4 +1029,4 @@ var RealexHpp = (function () { _internal: internal }; -}()); \ No newline at end of file +}());