36 lines
1.4 KiB
JavaScript
36 lines
1.4 KiB
JavaScript
|
function main(page) {
|
||
|
|
window.currPage = page;
|
||
|
|
window.currOpacity = 1;
|
||
|
|
document.getElementById("about-link").attributes.removeNamedItem("href");
|
||
|
|
document.getElementById("games-link").attributes.removeNamedItem("href");
|
||
|
|
document.getElementById("blog-link").attributes.removeNamedItem("href");
|
||
|
|
document.getElementById("about-link").onclick = function () { return openPage("about"); };
|
||
|
|
document.getElementById("games-link").onclick = function () { return openPage("games"); };
|
||
|
|
document.getElementById("blog-link").onclick = function () { return openPage("blog"); };
|
||
|
|
}
|
||
|
|
function openPage(page) {
|
||
|
|
if (page == window.currPage) {
|
||
|
|
return;
|
||
|
|
}
|
||
|
|
slideOpacity(function () {
|
||
|
|
document.getElementById(window.currPage).className = "hiddenarea";
|
||
|
|
window.currPage = page;
|
||
|
|
document.getElementById(page).style.opacity = "0";
|
||
|
|
document.getElementById(page).className = "";
|
||
|
|
window.history.pushState(page, page, "/" + page + "/");
|
||
|
|
slideOpacity(function () {
|
||
|
|
}, 1.5);
|
||
|
|
}, -1.5);
|
||
|
|
}
|
||
|
|
function slideOpacity(callback, step) {
|
||
|
|
var currElem = document.getElementById(window.currPage);
|
||
|
|
var id = setInterval(function () {
|
||
|
|
window.currOpacity += 0.02 * step;
|
||
|
|
currElem.style.opacity = "" + window.currOpacity;
|
||
|
|
if ((window.currOpacity <= 0 && step < 0) || (window.currOpacity >= 1 && step > 0)) {
|
||
|
|
clearInterval(id);
|
||
|
|
callback();
|
||
|
|
}
|
||
|
|
}, 2);
|
||
|
|
}
|