Как получить ширину абсолютного / фиксированного элемента с помощью jquery / js при изменении размера? - PullRequest
Новая
       1

Как получить ширину абсолютного / фиксированного элемента с помощью jquery / js при изменении размера?

1 голос
/ 11 апреля 2011

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

<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.

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

1 Ответ

2 голосов
/ 11 апреля 2011

Вы можете взять ширину окна и минус 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;
...