¿Cargar cuadro de diálogo programado en jQuery Mobile?

Question

Estoy tratando de crear cuadros de diálogo en jQuery Mobile que aparecen cuando hace clic en un marcador de Google Maps.

URL de ejemplo: http://cyclestreets.darkgreener.com/location/ (desplácese a una ubicación en Londres, Reino Unido para ver los marcadores).

Tengo parte del camino, con este código:

google.maps.event.addListener(map_marker, 'click', function() { 
    $.mobile.changePage({ url: $("#photo"), data: "id=" + marker.id, type: "GET"}, 'pop', false, true); 
}); 

embargo, algunas cuestiones que ver con el estilo y los datos:

1. El diálogo que aparece es completa pantalla. ¿Hay alguna manera de que pueda hacerlo en pantalla parcial, like the default jQuery Mobile dialogs, y como los cuadros de diálogo Acerca y Prefs on my home page?
2. No hay un vínculo cercano en el encabezado, que nuevamente, there is in the default jQuery mobile dialog. ¿Puedo asegurarme de que aparece, sin agregarlo a mano?
3. En el evento .live() del cuadro de diálogo, ¿cómo puedo recuperar los datos que le he pasado?

Answer 1

Desde beta 1, para obtener un div para aparecer como un cuadro de diálogo, utilice el atributo data-role="dialog" en el lugar de divdata-role="page".

Answer 2

function openPopup(element_id) 
{ 
    $.mobile.changePage(element_id, { transition: "pop", role: "dialog", reverse: false }); 
} 

Answer 3

Tenga en cuenta que los cuadros de diálogo jQuery requieren que haya contenido y cabecera divs en roles de datos para el estilo que se aplicará de manera apropiada. Esto le dará el diálogo completo con el botón Cerrar en el encabezado.

<div data-role="dialog" id="dialog" > 
<div data-role="header"><h3>Oops!</h3></div> 
<div data-role="content"> 
    <p>You done screwed up, partner!</p> 
</div> 

</div>