Привет, у меня небольшой плагин для динамического изменения высоты строк и ширины столбцов таблицы с помощью UI resizable (по сути работает так - при изменении размеров ячейки, изменяются соответствующие высота строки и ширина столбца, а размеры самой ячейки не меняются).
Не могу сообразить почему в Firefox не срабатывает событие stop при растягивании ячейки. То есть при отпускании мышки ресайцинг продолжается как будто хэндлер (стрелочка) прилип к мышке. В хроме работает нормально
Фрагмент кода, где происходит ресайцинг:
// При наведении на ячейку таблицы
$(table).find('td, th').hover(function(event) {
event.preventDefault();
event.stopPropagation();
// $tr и $th - это строка и столбец, которым соответствует текущая ячейка
var $th = $(table).find('th[data_x="'+$(this).attr('data_x')+'"]');
var $tr = $(this).parent('tr');
// $(this) - это текущая ячейка
$(this).resizable({
minWidth: 25,
resize: function(event, ui) {
event.preventDefault();
event.stopImmediatePropagation();
// Убирает выделение всех ячеек (вспомогательная функция)
myTable.deselectAll();
// Изменяем ширину столбца и высоту строки (соответствующие текущей ячейке)
$th.css('width', ui.size.width+'px');
$tr.css('height', ui.size.height+'px');
},
stop: function (event, ui) {
// В Firefox'e это не выводится в консоль!
console.log('resize stopped!');
// Убираем стили высоты и ширины текущей ячейки, так как в процессе ресайцинга мы уже изменили высоту строки ($tr) и ширину столбца ($th) (см. выше)
if (ui.element.is('td')) ui.element.css({width: '', height: ''});
else if (ui.element.is('th')) ui.element.css({height: ''});
}
});
