2014-09-30 2 views
0

Я пытаюсь сделать изменяемые по размеру компоненты, которые остаются горизонтально центрированными при изменении размера. Я нашел в this обсуждение решение для правой стороны. Я попытался расходовать это поведение на левую сторону. Но я столкнулся с необычным поведением с обработчиком событий.JQueryUI изменение размера от центра, сбой ручки

При изменении размера справа он работает как шарм. Когда вы изменяете размер слева, он сломан. Я думаю, что исходный тест событий является причиной. var originalTarget = $(event.originalEvent.target).hasClass("ui-resizable-w")

Адрес fiddle. Просто измените размер div на западную сторону справа налево и наоборот, и вы увидите, иногда он считает, что я не изменяю размер элемента с запада.

Могу ли я изменить свою стратегию? искать другой способ отличить, где происходит изменение размера?

ответ

1

См: http://jsfiddle.net/V79Ge/187/

Я изменил повторно проклейки логика, как упомянуто ниже & он решает проблему,

$('#resizeMe').resizable({ 
    handles : 'n, s, e, w', 
    resize: function(event, ui) { 
     var isLeft = ui.position.left > ui.originalPosition.left; 
     if(isLeft){ 
      $(this).css({ 
       'left': parseInt(ui.position.left, 10) - ((ui.originalSize.width - ui.size.width))/2 
      }); 
     } else { 
      $(this).css({ 
       'left': parseInt(ui.position.left, 10) + ((ui.originalSize.width - ui.size.width))/2 
      }); 
     } 
    } 
}); 
+0

поведение является правильным, когда новая ширина меньше, чем оригинал, но а не когда он больше. Но я буду работать над вашим решением. – TCHdvlp

+0

Вы показали мне путь, thx! Я просто заменил '' '' '' = 'в тесте, и он работает! – TCHdvlp

+0

Добро пожаловать! - @TCHdvlp –

Смежные вопросы