#98 - big popups was incorrectly positioned in studio

inc/js/jquery.dolPopup.js

@@ -194,7 +194,7 @@
                 
                 setTimeout(function () {
                     o.onShow();                    
-                    $el.find('input[type=text]').focus(); // put cursor to the first input element
+                    $el.find('input[type=text]:first').focus(); // put cursor to the first input element
                 }, o.speed);
 
             }, 100);
@@ -484,7 +484,7 @@
             } else if (o.position == 'centered') {
 
                 $el.position({
-                    of: window,
+                    of: window,                    
                     my: 'center center+' + ($el.outerHeight() > $(window).height() ? parseInt(($el.outerHeight() - $(window).height()) / 2) : '0'),
                     at: 'center center',
                     collision: 'none none'

samples/popup.php

@@ -56,6 +56,17 @@ function PageCompMainCode()
     echo '<div class="bx-clear"></div>';
     echo '<hr class="bx-def-hr" />';
 
+    // transBox    
+    echo BxTemplFunctions::getInstance()->transBox('bx-sample-popup-transbox-scrolled', '<div class="bx-def-padding">' . str_repeat('transBox transBox transBox <br />', 100) . '</div>', true);
+    echo '<div></div><button class="bx-btn bx-def-margin-sec" onclick="$(\'#bx-sample-popup-transbox-scrolled\').dolPopup()">transBox scrolled</button>';
+
+    // popupBox
+    echo BxTemplFunctions::getInstance()->popupBox('bx-sample-popup-box-scrolled', 'popupBox', str_repeat('popupBox ', 1000), true);
+    echo '<button class="bx-btn bx-def-margin-sec" onclick="$(\'#bx-sample-popup-box-scrolled\').dolPopup()">popupBox scrolled</button>';
+
+    echo '<div class="bx-clear"></div>';
+    echo '<hr class="bx-def-hr" />';
+
     // transBox with pointer
     echo BxTemplFunctions::getInstance()->transBox('bx-sample-popup-transbox-with-pointer', '<div class="bx-def-padding">transBox with pointer</div>', true);
     echo '<button class="bx-btn bx-def-margin-sec" onclick="$(\'#bx-sample-popup-transbox-with-pointer\').dolPopup({pointer:{el:$(this)}})">transBox with pointer</button>';
@@ -80,6 +91,8 @@ function PageCompMainCode()
     echo '<button class="bx-btn bx-def-margin-sec" onclick="$(\'#bx-sample-popup-image\').dolPopupImage(\'samples/img/small.jpg\', this)">popupImage (small)</button>';
     echo '<button class="bx-btn bx-def-margin-sec" onclick="$(\'#bx-sample-popup-image\').dolPopupImage(\'samples/img/square.jpg\', this)">popupImage (square)</button>';
 
+    echo str_repeat('&nbsp; <br />', 100);
+
     return DesignBoxContent("Sample popup", ob_get_clean(), BX_DB_PADDING_DEF);
 }
 

studio/template/_sub_footer.html

@@ -4,4 +4,5 @@
             <div class="bx-std-cb"></div>
         </div>
     </div>
-<bx_include_auto:_footer.html />
+</div>
+<bx_include_auto:_footer.html />

studio/template/_sub_header.html

@@ -1,5 +1,7 @@
 <bx_include_auto:_header.html />
 
+<div class="bx-main">
+
     <div class="bx-std-page-bg<bx_injection:injection_bg_style />">
         <bx_injection:injection_bg_content />
     </div>

studio/template/css/general.css

@@ -1,6 +1,7 @@
 html,
 body {
-	height: 100%;
+	min-height: 100%;
+    min-height: 100vh;
 }
 iframe.bx-std-hidden {
 	display: none;
@@ -20,6 +21,7 @@ div.bx-std-cb {
 div.bx-std-page-real {
 	width: 100%;
 	min-height: 100%;
+    min-height: 100vh;
 	overflow: hidden;
 }
 div.bx-std-page-wide {

template/css/common.css

@@ -37,6 +37,12 @@ blockquote {
     padding-left: 10px;
 }
 
+.bx-main {
+	position: relative;
+	min-height: 100%;
+	min-height: 100vh;
+}
+
 .bx-clear {
     clear:both;
     float:none;

template/css/general.css

@@ -1,10 +1,4 @@
 
-.bx-main {
-	position: relative;
-	min-height: 100%;
-	min-height: 100vh;
-}
-
 .bx-page-image-container img,
 .bx-page-html-container img {
     max-width:100%;