getBox() returns an object which represents the size of the viewport.

The viewport is the part of the document that is visible on the screen. In contrast to this, the part of the document that is scrolled out of view is not part of the viewport. In order to get the size of the viewport, you can use getBox().


require(["dojo/window"], function(win){
   var vs = win.getBox();
   // vs is an object that is the size of the viewport


This example “grays out” the screen.

require(["dojo/window", "dojo/dom-construct", "dojo/_base/window", "dojo/dom", "dojo/on", "dojo/domReady!"],
function(win, domConst, baseWin, dom, on){
  on(dom.byId("gray"), "click", function(){
    var vs = win.getBox(),
        div = domConst.create("div", {
          style: {
            position: "absolute",
            top: "0px",
            left: "0px",
            width: vs.w + "px",
            height: vs.h + "px",
            backgroundColor: "gray",
            opacity: 0.1
        }, baseWin.body());

    }, 1000);
<button type="button" id="gray">Gray the Screen</button>

See Also

Error in the documentation? Can’t find what you are looking for? Let us know!