2011-11-04 14 views
12

Jak mogę umieścić okno jQuery UI SZCZEGÓLNOŚCI tak, że przechodzi do pozycji nie zdefiniowanej przez centrum, top, itpStanowisko dialogowego jQuery UI

Dzięki, starałem się być jak posible.

+1

http://stackoverflow.com/questions/744554/jquery-ui-dialog- pozycjonowanie – Dev

Odpowiedz

25

Użycie opcji position: http://jqueryui.com/position/

Określa gdzie mają być wyświetlane okno dialogowe. Możliwe wartości:

1) pojedynczy ciąg reprezentujący pozycję w obszarze wyświetlania: "środek", "lewo", "prawo", "góra", "dół".
2) tablicę zawierającą współrzędnych x, y parę pixel przesunięty w lewo, górnym narożniku okna (np [350100])
3) tablicę zawierającą Wartości x, łańcuch y pozycji (np [ „prawo” , 'top'] w prawym górnym rogu).

Na przykład: $(".selector").dialog("option", "position", [350,100]);

+3

Zwróć uwagę, że ta forma tablicy pozycji jest teraz przestarzała http://api.jqueryui.com/dialog/#option-position – Cheekysoft

7

Jeśli chcesz korzystać z pozycjonowania bezwzględnego position opcja w oknie dialogowym jest to, czego potrzebujesz. Jeśli trzeba ustawić w stosunku do innych elementów, nie ma innej łatwy technika użyć, jQuery UI $('selector').position(options); (obserwowane u: http://jqueryui.com/demos/position/)

Na przykład:

// div to position against 
var $div = $('#someDiv'); 

// Open dialog (positioning won't work on hidden elements) 
$dialog.dialog('open'); 

// position newly opened dialog (using its parent container) below $div. 
$dialog.dialog('widget').position({ 
    my: "left top", 
    at: "left bottom", 
    of: $div 
}); 
+0

@Cheekysoft Twój komentarz wydaje się sugerować, że ten formularz jest przestarzały. Nie jest to użycie tablicy, ale parametr obiektu, który jest pożądanym typem parametru dla metody position. Masz rację mówiąc, że formularze parametrów tablicy i ciągu są przestarzałe. –

17

Nie jest to dokładna odpowiedź na swoje pytanie , ale można mieszać „top” z wartości pikseli, tak:

$('#widget').dialog({ 
    position: ['top', 100] 
}); 

to będzie umieścić dialog skoncentrowany wzdłuż osi X 100 pikseli w dół od góry.

+0

Tak, więc wiesz, składnik 'top 'nie robi nic w tym przykładzie. Po przejściu tablicy do opcji pozycji oczekuje się pary współrzędnych ["[x, y]"] (http://api.jqueryui.com/dialog/#option-position). Ciąg nie może zostać sparsowany jako liczba całkowita, więc domyślne położenie poziome pozostaje w środku. Możesz zastąpić część '' top'' dowolnym łańcuchem i nadal będzie działała w ten sam sposób: [** Fiddle Demo **] (http://jsfiddle.net/KyleMit/978UW/) – KyleMit

+0

Dzięki za wyjaśnienia. – camainc