How to get max available document height in a browser?

Question

Can anyone tell me how can i get max available height when browser is maximised. Not screen, avilHeight or document.height.

<script type="text/javascript">
    document.getElementById("wrapper").style.height=screen.availHeight + "px";
</script>

For my resolution (1366x768) screen,avilHeight or document.height returns 728px which is the browser height but i want only max document height.

Answer 1

function resolution()
{
        var width = window.innerWidth || html.clientWidth  || body.clientWidth  ||  screen.availWidth;
        var height = window.innerHeight || html.clientHeight  || body.clientHeight  || screen.availHeight;
        res = {};   
        res.x = width;
        res.y = height;
        return res;
}

Answer 2

You can make an assumption based on window.innerHeight , window.outerHeight , and screen.availHeight :

var maximizedHeight = screen.availHeight - (window.outerHeight - window.innerHeight);

It's not a particularly good solution, though. If your content adapts to any size, why not handle the resize event? If possible, CSS is even better – what's the situation?