nonshy/website
nonshy/website
1
0
Fork 0
Code Issues 20 Pull Requests 1 Packages Projects Releases Wiki Activity

Dropdown menus to open up near bottom of the page

Browse Source
This commit is contained in:
Noah Petherbridge 2024-08-10 11:18:52 -07:00
parent a00851a8b2
commit 1936bcde37
1 changed files with 14 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
web/static/js/bulma.js
View File

@ -1,4 +1,4 @@
// Hamburger menu script for mobile. // Bulma CSS fixes and features for nonshy.
document.addEventListener('DOMContentLoaded', () => { document.addEventListener('DOMContentLoaded', () => {
// Make all off-site hyperlinks open in a new tab. // Make all off-site hyperlinks open in a new tab.
@ -84,6 +84,19 @@ document.addEventListener('DOMContentLoaded', () => {
// Dropdown menus. // Dropdown menus.
(document.querySelectorAll(".dropdown") || []).forEach(node => { (document.querySelectorAll(".dropdown") || []).forEach(node => {
// If this dropdown is near the bottom of the page, make it open upwards.
if (!node.classList.contains("is-up") && !node.classList.contains("is-right")) {
let offsetTop = node.offsetTop,
body = document.body,
html = document.documentElement,
pageHeight = Math.max(body.scrollHeight, body.offsetHeight,
html.clientHeight, html.scrollHeight, html.offsetHeight,
);
if (pageHeight - offsetTop < 450) {
node.classList.add("is-up");
}
}
const button = node.querySelector("button"); const button = node.querySelector("button");
button.addEventListener("click", (e) => { button.addEventListener("click", (e) => {
node.classList.toggle("is-active"); node.classList.toggle("is-active");