There is such code:

$('.header-x').css({'background-size': screenWidth + ' auto'});

But it does not work.

Can anyone help with the right decision?

  • And this option will not work? $('.header-x').css({'background-size': '100% auto'}); Or better .header-x { background-size: 100% auto; } .header-x { background-size: 100% auto; } Of course, only if your .header-x width is equal to screenWidth - Evgeny Mironov

1 answer 1

 setTimeout(() => { screenWidth = 50; document.querySelector('.header-x').style.backgroundSize = screenWidth+'px auto' }, 666); 
 .header-x{ width: 100px; height: 100px; border: 1px solid black; background-image: url(https://cdn2.iconfinder.com/data/icons/travel-roundline/512/wall-512.png); // Ваш косяк в том, что вы забыли единицы измерения. // Так это не работает: background-size: 50 auto; } 
 <div class='header-x'></div>