Skip to content

Bug in Readme > Installation section #12

@hardrese7

Description

@hardrese7

Now it uses document.documentElement.clientHeigh, however it doesn't change on show/hide status bar. In the original article they use window.innerHeight, next code works for me:

var customViewportCorrectionVariable = 'vh';
function setViewportProperty(doc) {
var prevClientHeight;
var customVar = '--' + ( customViewportCorrectionVariable || 'vh' );
function handleResize() {
    var clientHeight = window.innerHeight;
    if (clientHeight === prevClientHeight) return;
    requestAnimationFrame(function updateViewportHeight(){
        doc.style.setProperty(customVar, (clientHeight * 0.01) + 'px');
        prevClientHeight = clientHeight;
    });
}
handleResize();
    return handleResize;
}
window.addEventListener('resize', setViewportProperty(document.documentElement));

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions