jquery mobile - example - ¿Cómo comprobar si la ventana emergente jQM se adapta a la ventana gráfica del usuario?

popup image jquery

Question

Así que he logrado agregar barras de desplazamiento a grandes ventanas emergentes jQM con css(''overflow-y'', ''scroll'') . ¿Pero cómo hacer esto solo cuando la ventana emergente es más grande que la ventana gráfica del usuario?

Lo intento con el plugin jquery-visible, pero no puedo responderlo:

http://jsfiddle.net/mmRnq/124/

$(''#test-button'').on(''click'', function(e) {     
  $(''#confirmDialog'').popup(''open'');

  // https://stackoverflow.com/questions/20791374/jquery-check-if-element-is-visible-in-viewport  

  if(!$(''#confirmDialog'').visible(true)) {
    alert(''Popup not fully visible - add overflow scrolling'');
    $(''#confirmDialog'').css(''overflow-y'', ''scroll''); 
  }  
});

Answer 1

Puedes usar

overflow-y: auto

Esto hace que la barra de desplazamiento solo sea visible cuando sea necesario.

FIDDLE actualizado

ACTUALIZAR:

También puede hacer que el contenido de la ventana emergente sea desplazable para que la barra de título permanezca a la vista:

#confirmDialog .ui-content {
    overflow-y: auto;
}

$(''#confirmDialog'').on({
  popupbeforeposition: function() {
      var maxHeight = $(window).height() - 120;
      $(''#confirmDialog .ui-content'').height(maxHeight);
  }
});

MANIFESTACIÓN