Почему некоторые методы jQuery и JavaScript ведут себя подобным образом ⇐ Jquery

[Гость]

Мне пришлось запустить событие, проверяющее ширину экрана, чтобы адаптировать некоторые конкретные стрелки на карусели, потому что точка останова CSS не работала.
Я заметил это

Код: Выделить всё

$(window).width();

was not returning a correct width but it was always offset in some way making the arrows do weird things, and that these events were only called at the start and not called every time I resized:

Код: Выделить всё

$(window).on('resize', function(){});

Код: Выделить всё

window.onresize = reportWindowSize;

The ways I fixed both problems were using these methods:

• for the resize event:

  Код: Выделить всё

  $(function() {
  $(window).resize(fixArrowMargin).trigger('resize');
  });
  

• for the browser's width:

  Код: Выделить всё

  window.innerWidth;

Could someone provide me with an answer on how these methods work and why they behaved like that?
Steps to reproduce problem i was having (arrows going over image which they should not)
Using Swiper element Library!
Html

Код: Выделить всё

IMG
h3 P
Learn More!



[img]http://lorenzos70.sg-host.com/wp-content/uploads/2024/02/freccia-sx.svg[/img]

[img]http://lorenzos70.sg-host.com/wp-content/uploads/2024/02/freccia-dx.svg[/img]

CSS

Код: Выделить всё

.whole-slide {
position: relative;
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
}

.arrow-to-slider {
position: relative;
display: flex;
justify-content: center;
align-items: center;
}

.carouselCws-button-prev,
.carouselCws-button-next {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
z-index: 2;
}

.carouselCws-button-prev { left: 31%; }

.carouselCws-button-next { left: 69%; }

Источник: https://stackoverflow.com/questions/781 ... -like-that