n8finch
11/21/2016 - 3:51 AM

Make jQuery UI's Dialog Popup Responsive with JavaScript

Make jQuery UI's Dialog Popup Responsive with JavaScript

//Get Window Screen Width

    var screenWidth, screenHeight, dialogWidth, dialogHeight, isDesktop;

    screenWidth = window.screen.width;
    screenHeight = window.screen.height;

    if ( screenWidth < 500 ) {
        dialogWidth = screenWidth * .95;
        dialogHeight = screenHeight * .95;
    } else {
        dialogWidth = 500;
        dialogHeight = 500;
        isDesktop = true;
    }

    setTimeout(function(){
      $(function() {
          $("#n8f-popup-login-message").dialog({
              title: 'Welcome to Startup Academy!',
              draggable: false,
              modal: true,
              height: dialogHeight,
              width: dialogWidth,
              closeOnEscape: false,
              open: function() {
                if(isDesktop) {
                  disableScroll();
                }
              }
          });

      });
    }, 2000);