alex-lenk
@alex-lenk
Разработчик сайтов

Как задать минимальный и максимальный ресайз колонки?

Здравствуйте. Нашел подходящий для моих нужд скрипт jsfiddle.net/pkryfjzz/7

Как задать минимальный и максимальный ресайз первой колонки (минимум 50% максимум 75%)?

<table class="wrapper">
    <tr>
    <td class="test" style="">current</td>
    <td class="test2" style="">neighbor2</td>
    </tr>
</table>

$(document).ready(function() {
  var container = $(".wrapper");
  var numberOfCol = 1;
  $(".test").css('width', 50 / numberOfCol + '%');

  var sibTotalWidth;
  $(".test").resizable({
    handles: 'e',
    start: function(event, ui) {
      sibTotalWidth = ui.originalSize.width + ui.originalElement.next().outerWidth();
    },
    stop: function(event, ui) {
      var cellPercentWidth = 100 * ui.originalElement.outerWidth() / container.innerWidth();
      ui.originalElement.css('width', cellPercentWidth + '%');
      var nextCell = ui.originalElement.next();
      var nextPercentWidth = 100 * nextCell.outerWidth() / container.innerWidth();
      nextCell.css('width', nextPercentWidth + '%');
    },
    resize: function(event, ui) {
      ui.originalElement.next().width(sibTotalWidth - ui.size.width);
    }
  });
});
  • Вопрос задан
  • 243 просмотра
Решения вопроса 1
jsfiddle.net/pkryfjzz/9
С помощью css задайте min/max-width для обоих блоков
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы