DONT ADD ANYTHING HERE!

Static
fixed
Static

Click the divs

Notes

Clicking on a div in the above diagram causes one of the following CSS class to be added/removed: 

        .fixed {
            position: fixed;
            top: 10vh;
            left: 0
        }

        .fixed-two {
            position: fixed;
            top: 10vh;
            right: 0
        }

        .fixed-three {
            position: fixed;
            bottom: 0;
            right: 50vw;
        }

Code

HTML

<div class="fixed-container">
    <div id="div-four">Static</div>
    <div id="div-five" class="fixed">fixed</div>
    <div id="div-six">Static</div>
    <p>Click the divs</p>
</div>

CSS

    .fixed {
        position: fixed;
        top: 10vh;
        left: 0
    }

    .fixed-two {
        position: fixed;
        top: 10vh;
        right: 0
    }

    .fixed-three {
        position: fixed;
        bottom: 0;
        right: 50vw;
    }

    div.fixed-container {
        margin: 5px auto;
        width: 60%;

        border: 2px solid orange;
        position: relative;
    }

    div.fixed-container #div-four,
    div.fixed-container #div-five,
    div.fixed-container #div-six {
        width: 8vw;
        line-height: 8vw;
        display: inline-block;
        text-align: center;
        margin: 1vw;
        font-size: 1.8vw;
    }

    #div-four {
        background: red;
        text-decoration: underline dotted;
    }

    #div-five {
        background: lime;
        text-decoration: underline dotted;
    }

    #div-six {
        background: blue;
        color: white;
        text-decoration: underline dotted;
    }

JavaScript

    function toggleClass(id, toggleClass, toggleMsg) {
        if (document.getElementById(id)) {
            document.getElementById(id).addEventListener('click', function () {
                if (this.classList.contains(toggleClass)) {
                    this.classList.remove(toggleClass);
                    this.innerHTML = "Static";

                } else {
                    this.classList.add(toggleClass);
                    this.innerHTML = toggleMsg;
                }
            });
        }
    }

    toggleClass('div-four', 'fixed-three', 'fixed');
    toggleClass('div-five', 'fixed', 'fixed');
    toggleClass('div-six', 'fixed-two', 'fixed');

References