Блог

Допустим, у вас есть элемент с фиксированным или абсолютным расположением:

 <div>
   My fixed div.
</div>
  

С помощью следующего css:

 div:first-of-type {
    background-color: red;
    position: fixed;
    top: 20px;
    left: 20px;
    right: 20px;
    bottom: 20px;
}
  

Вы можете определить ширину с помощью:

 $(function() {
    $(window).resize(function() {
        var $myFixedDiv = $('div:first');

        console.log($myFixedDiv.width()); //$myFixedDiv.innerWidth(), $myFixedDiv.outerWidth() 
    });

});
  

Однако при изменении размера окна ширина, указываемая как Firefox, так и Chrome, равна 0.

Как бы определить, какова истинная ширина?

Вы могли бы взять ширину окна и минус 40 от обеих осей.

 var width = $(window).width()-40;
var height = $(window).height()-40;
  

Тогда вместо того, чтобы использовать css top, left, bottom и right для установки ширины, поскольку я думаю, что это ненадежно в долгосрочной перспективе, я бы установил ширину div с помощью js

 var myDiv = $('#myDiv');
myDiv.width = width;
myDiv.height = height;