jQuery Datepicker - добавить класс в зависимости от того, где он появляется

Question

Мне нужно добавить класс «выше» или «ниже» к моему элементу ввода в зависимости от того, на какой стороне открывался указатель даты.

Кажется, я просто не могу понять, как получить позицию экземпляра DatePicker, который НАМ создать ... может быть, я просто неправильно об этом думаю.

     $('#order-main .datepicker').datepicker({
    showOn: 'both',

     buttonImage: 'img/icons/calendar.png',
     buttonImageOnly: true,
     minDate: -1,
     maxDate: "+1Y",
     showButtonPanel: true,
     showAnim: 'slideDown',
     hideIfNoPrevNext: true,
     dateFormat: 'yyyy-mm-dd',
     duration: 500,
     beforeShow: function(input, inst) {
      var pos = $(input).offset().top;
      // if the top position of the to-be-created instance is < top position 
      //of the elemnt, its ABOVE, therefore add above, otherwise add below.
          inst.dpDiv.addClass('above')
         }
    });

Я знаю, как его расширить, используя $ .extend ($. Datepicker, {_ checkOffset: function (inst, offset, isFixed) {return offset}}); поэтому он всегда будет показан ниже, но я бы предпочел сохранить его функциональность динамического размещения, но просто ЗНАЙТЕ, будет ли он выше или ниже, чтобы я мог правильно оформить свой элемент ввода.

Маленькая вещь, но было бы неплохо закончить.

Answer 1

Я думаю, это то, что вы ищете.

Используйте положение вместо смещения.

beforeShow: function(input, inst) {
    if (inst.dpDiv.position().top > $(input).position().top) {
        inst.dpDiv
            .removeClass('below')
            .addClass('above');
    } else {
        inst.dpDiv
            .removeClass('above')
            .addClass('below');
    }
}