Как получить ширину окна через Javascript

Question

Я ищу некоторую помощь относительно моего Jquery.У меня есть анимация, открывающая меню навигации, бегущая от правого окна сайта в середину.Теперь я хочу сделать следующее: когда пользователь уменьшает ширину окна браузера (скажем, с шагом 100 пикселей), анимация должна работать на 100 пикселей меньше в середине.Ниже вы можете ознакомиться с краткой версией моего кода.Есть ли способ определить ширину, используя значение класса, который я написал в моем CSS?

$(".slide-left").click(function(){
            $("#navibox").animate({ width: 863 }); });

Answer 1

Спасибо!Я уже пробовал что-то вроде этого:

$(window).resize(function(){
if ($(window).width() > 1000) { mywidth = 863; }
if ($(window).width() < 1001 && $(window).width() > 959 ) { mywidth = 823; }
if ($(window).width() < 960) { mywidth = 783; }
});```

In the animation I used:

```$("#navibox").animate({ mywidth });```

But that did not work...

Answer 2

Вы не можете определить ширину со значением в классе.Хотя, чтобы получить ширину самого окна, вы можете использовать

window.innerWidth

Если вы хотите, чтобы какой-то код запускался при изменении размера, вы можете добавитьeventListener, с именем события 'resize', как это.

window.addEventListener ('resize', (e) => {})

Событиепередаваемый из этого обратного вызова имеет свойство 'target', которое является экземпляром окна, из которого вы можете снова получить innerWidth.

Если вам нужно обновить анимацию с некоторой новой оцененной шириной, вы можете сделать это там.