javascript - 如何获取浏览器窗口内容的实际宽度？

Question

我正在使用 JavaScript 定位我的元素。为了完美地做到这一点，我必须获得可用的水平空间量。糟糕的是，$(window).width()没有考虑滚动条的宽度。结果是这样的：

坏 http://dl.dropbox.com/u/62862049/Screenshots/fb.png

在这里，“Pagina 1”包含在一个应该与窗口右边框对齐的小 div 中。好吧，它确实 - 从字面上看 - 忽略了覆盖部分 div 的滚动条，将“Página 1”的“1”扔到下一行。

Answer 1

这类似于之前的两个问题：

如何在没有滚动条的jquery中获取元素的innerWidth

和

如何在没有（减号）滚动条的情况下获得屏幕宽度？

Answer 2

使用这个功能

function scrollbar_width() {

        var calculation_content = $('<div style="width:50px;height:50px;overflow:hidden;position:absolute;top:-200px;left:-200px;"><div style="height:100px;"></div>');
        jQuery('body').append(calculation_content);
        var width_one = jQuery('div', calculation_content).innerWidth();
        calculation_content.css('overflow-y', 'scroll');
        var width_two = jQuery('div', calculation_content).innerWidth();
        jQuery(calculation_content).remove();
        return (width_one - width_two);

    }

现在计算可用

var availableWidth = $(window).width() - scrollbar_width();