[61]
29 мая 2014, 15:57

Узнать ширину полосы прокрутки в браузере

Привет!

Ширина полосы прокрутки различается от браузера к браузеру. На ПК она может быть от 14 до 18 пикселей, а так же 0 пикселей, как например в IE, так как она там присутствует всегда.

Стоит задача определения ширины этой полосы через JavaScript. Есть ли какой-нибудь адекватный способ это сделать?

Комментарии (7)
grom
29 мая 2014, 19:01
#

Если использовать jQuery будет как-то так…

function scrollWidth()
{
var div = $('<div>').css({
position: "absolute",
top: "0px",
left: "0px",
width: "100px",
height: "100px",
visibility: "hidden",
overflow: "scroll"
});

$('body').eq(0).append(div);

var width = div.get(0).offsetWidth - div.get(0).clientWidth;

div.remove();

return width;
}

alert(scrollWidth());
BoogVAr
29 мая 2014, 19:35
#

А для чего точно требуется определить именно ширину этой полосы?
Если вам требуется получить ширину и высоту рабочей области браузера то это легко сделать.

youbi
29 мая 2014, 20:13
#

Нужно программно скрывать полосу прокрутки. Но если это делать, рабочая область растягивается и контент немного сдвигается вправо и получается некрасивое дергание. Что бы этого не происходило я буду добавлять правый margin тем самым уравновешивать скрытый скролл.

BoogVAr
31 мая 2014, 10:18
#

А не проще получить ширину рабочей области занести её контентом и прижать к левому краю, при скрытии полосы справа там просто останется пустое место если ширина контента будет зафиксирована. Так сказать оберни во врапер всё и прижми его к левому краю, даже если у тебя сайт по центру.

BoogVAr
31 мая 2014, 10:20
#

И скрывай полосу на уровне css, тогда будет ещё меньше гемороя и скачков экрана.
overflow-x:hidden;
overflow-y:hidden;

youbi
01 Июн 2014, 18:33
#

Так и скрываю.

youbi
01 Июн 2014, 18:42
#

Дело в том, что тогда придется отлеживать ресайз окна браузера. Придется вешать на body событие onResize. А оно работает, только если указать его параметром тега. Да и при быстром ресайзе или тормозах браузера, возникновение события тормозит.

При возврате скролла нужно будет все возвращать на места и событие ресайза блокировать. Вообщем с margin проще.

Добавить комментарий

Войдите, чтобы написать о чем-нибудь...
Вход Регистрация
Web.onRails
Здесь вы можете спросить или написать обо всём, что касается Веб-разработки.
написать о чем-нибудь...
Метки: