JSFiddle - React, Tailwind, and code Playground

HTML

<div id="nav">
    <a href="#page1">1</a>
    <a href="#page2">2</a>
    <a href="#page3">3</a>
    <a href="#page4">4</a>
    <div style="clear: both">
</div>
<div id="content">
    <div id="page1" class="page active">Primeira página....</div>
    <div id="page2" class="page">Segunda página....</div>
    <div id="page3" class="page">Terceira página....</div>
    <div id="page4" class="page">Quarta página....</div>
</div>

CSS

#nav a {
    float: left;
    padding: 5px;
}

#content .page {
    display: none;
}

#content .active {
    display: block;
}

JavaScript

(function() {
    var nav = document.getElementById("nav"),
        content = document.getElementById("content"),
        pages = content.getElementsByClassName("page"),
    	links = nav.getElementsByTagName("a");

	function setPage() {
        var pages = content.getElementsByClassName("active");
        for(var j = 0; j < pages.length; ++j) {
            pages[j].className = pages[j].className.replace(/\s?active/gi, "");
        }
        document.getElementById(this.getAttribute("href").substr(1)).className += " active";
	}

    function onScroll(e) {
        var delta,
            element;
        if(!e) {
            e = window.event;
        }
        if(e.wheelDelta) {
            delta = e.wheelDelta / 120; 
        } else if(e.detail) {
            delta = -e.detail / 3;
        } else {
            return;
        }
        for(var j = 0; j < pages.length; ++j) {
            if(pages[j].className.match(/\sactive/ig)) {
                break;
            }
        }
        pages[j].className = pages[j].className.replace(/\s?active/ig, "");
        if(pages[j + delta]) {
            pages[j + delta].className += " active";
        } else if(delta === -1) {
            pages[pages.length - 1].className += " active";
        } else {
            pages[0].className += " active";
        }
    }

    for(var i = 0; i < links.length; ++i) {
	    if(window.addEventListener) {
	    	links[i].addEventListener("click", setPage);
	    } else if(window.attachEvent) {
	    	links[i].attachEvent("onclick", setPage);
	    }
    }
    if(window.addEventListener) {
    	window.addEventListener("mousewheel", onScroll);
   		window.addEventListener("DOMMouseScroll", onScroll);
    } else if(window.attachEvent) {
    	window.attachEvent("onmousewheel", onScroll);
    }
})();