Posizionamento finestra di dialogo jQuery

Question

Desidero posizionare la mia finestra di dialogo xQuery x-pixel lontano dal bordo destro del browser. È comunque possibile?

http://jqueryui.com/demos/dialog/

L'opzione posizione non sembra avere quel tipo di messa a punto, ma c'è qualche altro modo per farlo?

Answer 1

Se fate la vostra finestra di dialogo position:absolute, allora la sua presa su della normale flusso della pagina, ed è possibile utilizzare la proprietà left e top per posizionarlo in qualsiasi punto della pagina.

$('.selector').dialog({ dialogClass: 'myPosition' }); 

e definire la classe css myPosition come:

.myPosition { 
    position: absolute; 
    right: 200px; /* use a length or percentage */ 
} 

È possibile impostare il top, left, right e bottomproperties per myPosition utilizzando una lunghezza tale in pixel o in percentuale.

Answer 2

un'occhiata qui: http://jqueryui.com/demos/dialog/#option-position

inizializzare una finestra di dialogo con l'opzione posizione specificata.

$('.selector').dialog({ position: 'top' }); 

Ottenere o impostare l'opzione di posizione, dopo init.

//getter 
var position = $('.selector').dialog('option', 'position'); 
//setter 
$('.selector').dialog('option', 'position', 'top'); 

Answer 3

questo mantiene dialogo div in posizione fissa

questo funziona per me in IE FF Chrome e Safari

jQuery("#dialogDiv").dialog({ 
    autoOpen: false, 
    draggable: true, 
    resizable: false, 
    height: 'auto', 
    width: 500, 
    modal: false, 
    open: function(event, ui) { 
     $(event.target).parent().css('position', 'fixed'); 
     $(event.target).parent().css('top', '5px'); 
     $(event.target).parent().css('left', '10px'); 
    } 

}); 

quando si desidera finestra di dialogo aperta basta chiamare

$('#dialogDiv').dialog('open'); 

Answer 4

Questo ha funzionato per per visualizzare la finestra di dialogo nell'angolo in alto a destra con offset 10 px: position: "right-10 top+10":

$("#my-dialog").dialog({ 
    resizable: false, 
    height:"auto", 
    width:350, 
    autoOpen: false, 
    position: "right-10 top+10" 
}); 

Answer 5

Per fissare in posizione centrale, io uso:

open : function() { 
    var t = $(this).parent(), w = window; 
    t.offset({ 
     top: (w.height()/2) - (t.height()/2), 
     left: (w.width()/2) - (t.width()/2) 
    }); 
} 

Answer 6

Capisco la risposta è già accettato, ma solo nel caso in cui se qualcuno ha bisogno di più informazioni: http://salman-w.blogspot.co.uk/2013/05/jquery-ui-dialog-examples.html

$(function() { 
      $("#dialog").dialog({ 
       position: { 
        my: "right bottom", 
        at: "right bottom", 
        of: window 
       } 
      }); 
     }); 

Answer 7

La maggior parte di queste risposte sembravano essere soluzioni alternative per me, e volevo trovare il modo jQuery ufficiale per farlo. Dopo la lettura attraverso le .position() documenti, ho scoperto che si può effettivamente essere fatto nel inizializzazione del widget di jQuery:

$("#dialog").dialog({ 
    title:title, 
    position:{my:"right top",at:"right+100 top+100", of:"body"}, 
    width:width, 
    height:height 
}) 

Qualora la 100 è la distanza dalla destra e dall'alto, rispettivamente

Answer 8

con questo codice Potete specificare la vostra posizione superiore e sinistra:

$('#select_bezeh_window').dialog({ 
    modal:true, 
    resizable:false, 
     draggable:false, 
     width:40+'%', 
     height:500 , 
     position:{ 
      using: function(pos) { 
       $(this).css("top", 10+'px'); 
       $(this).css("left", 32+'%'); 
      } 
     } 
});