Как взять высоту блока на jquery?

Question

[vovaaar]

Есть блок в котором происходит прокрутка. Прикручен плагин NiceScroll. Чтобы корректно работать, необходимо в css этому блоку задать высоту.

Когда добавляются новые элементы в блок, мне необходимо брать его высоту, чтобы прокрутка всегда была внизу. Дабы видеть только актуальное.

Мой код:

<div class="battle-plan-plash">
  <div class="battle-plan-plash-holder scroll-js">
  </div>
</div>

.battle-plan-plash-holder {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-flow: row wrap;
  max-width: 330px;
  padding: 0 15px;
  max-height: 200px;
  overflow-y: auto;
  background: rgba(0, 0, 0, .3);
}

.battle-plan-plash-step {
  width: 100%;
  display: flex;
  justify-content: flex-start;
  align-items: flex-end;
  margin-bottom: 5px;
}

function bottomScroll(selector) {

  $(selector).getNiceScroll(0).doScrollTop($(selector).height() + 1, 1);
  console.log('Высота прокручиваемого блока: ' + $(selector).height());
}

$('.scroll-js').niceScroll({
  cursorcolor: "#424242", // change cursor color in hex
  cursoropacitymin: .3, // change opacity when cursor is inactive (scrollabar "hidden" state), range from 1 to 0
  cursoropacitymax: 1, // change opacity when cursor is active (scrollabar "visible" state), range from 1 to 0
  cursorwidth: "5px", // cursor width in pixel (you can also write "5px")
  cursorborder: "1px solid #5c5a6b", // css definition for cursor border
  cursorborderradius: "5px", // border radius in pixel for cursor
  scrollspeed: 40, // scrolling speed
  mousescrollstep: 30, // scrolling speed with mouse wheel (pixel)   
  //background: "#353542", // change css for rail background
  cursorminheight: 32, // set the minimum cursor height (pixel)
  autohidemode: "leave",
});

setInterval(function() {
  $('.battle-plan-plash-holder').append('<div class="battle-plan-plash-step">hello</div>');
  bottomScroll('.battle-plan-plash-holder');
}, 500)

Он работает хорошо, до тех пор пока не перешагнет рубеж в max-height: 200px; Я сам его поставил в css. без него не работает вертикальный скролл.

Проблема в том что функция которая берет высоту блока, когда доходит до 200 px, дольше не обновляет, так как задано фикс. Как побороть? Всем добра!

Answer 1

[bpGusar]

https://jsfiddle.net/0pf8am23/1/
не супер но работает, допили и будет норм

Answer 2

[Владимир]

Вы бы выложили код на jsfiddle, народ бы и потянулся...

Comments

[vovaaar]

Владимир
Готово:
https://jsfiddle.net/dm7y8af4/1/