UI позиционирование

Position

~lt~coment~gt~Эта утилита UI позволяет удобно позиционировать элементы (в часности UI-виджеты) относительно окна, документа, других элементов и даже курсора.~lt~/coment~gt~
~lt~!DOCTYPE html~gt~
~lt~html~gt~
~lt~head~gt~
  ~lt~meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /~gt~
  ~lt~script src="https://code.jquery.com/jquery-1.8.3.js"~gt~~lt~/script~gt~
  ~lt~script src="/ui/jqueryui.custom.js"~gt~~lt~/script~gt~
  ~lt~link type="text/css" href="/ui/jqueryui.custom.css" rel="stylesheet" /~gt~
  ~lt~style~gt~
    body{font:normal 9pt Arial,sans-serif;}
    #targetElement{ width:240px;height:200px;background-color:#999;margin:30px auto;}
    .positionDiv{width:50px;height:50px;opacity:0.6;}
    #position1{background-color:#F00;}
    #position2{background-color:#0F0;}
    #position3{background-color:#00F;}
    #position4{background-color:#FF0;}
  ~lt~/style~gt~
~lt~/head~gt~
~lt~body~gt~
  
  ~lt~div id="targetElement"~gt~
    ~lt~div class="positionDiv" id="position1"~gt~~lt~/div~gt~
    ~lt~div class="positionDiv" id="position2"~gt~~lt~/div~gt~
    ~lt~div class="positionDiv" id="position3"~gt~~lt~/div~gt~
    ~lt~div class="positionDiv" id="position4"~gt~~lt~/div~gt~
  ~lt~/div~gt~

  ~lt~script~gt~
    $("#position1").position({
      my: "center",
      at: "center",
      of: "#targetElement"
    });
    $("#position2").position({
      my: "left top",
      at: "left top",
      of: "#targetElement"
    });
    $("#position3").position({
      my: "right center",
      at: "right bottom",
      of: "#targetElement"
    });
    $(document).mousemove(function(ev){
      $("#position4").position({
        my: "left bottom",
        of: ev,
        offset: "3 -3",
        collision: "fit"
      });
    });
  ~lt~/script~gt~

~lt~/body~gt~
~lt~/html~gt~

Описание

Эта утилита jQuery UI, позволяющая удобно позиционировать элементы (в часности UI-виджеты) относительно окна (window), документа (document), других элементов и даже курсора. С ее помощью нельзя позиционировать скрытые элементы (hidden). Эта утилита является независимой и не требует подключения к странице других UI модулей (даже ядра jQuery UI).

Допустим, что необходимо расположить элемент с id=el1 в левом нижнем углу элемента с id=target так, чтобы первый спускался на пол своей высоты (пример с синем квадратиком в примере выше):

$("#el1").position({
  my: "right center",  // место на позиционируемом элементе
  at: "right bottom",  // место на элементе относительно которого будет позиционирование
  of: "#target"        // элемент относительно которого будет позиционирование
});

Список свойств