You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

dmxBootstrap5Navigation.js 1.2 KiB

2 years ago
12345678910111213141516171819202122232425262728293031323334353637383940
  1. (function() {
  2. // Call init when DOM is ready
  3. if (document.readyState === 'loading') { // Loading hasn't finished yet
  4. document.addEventListener('DOMContentLoaded', _init, { once: true });
  5. } else { // DOMContentLoaded has already fired
  6. _init();
  7. }
  8. function _init() {
  9. // Listen to url changes
  10. window.addEventListener('popstate', _update);
  11. window.addEventListener('pushstate', _update);
  12. // Listen to DOM changes and call update when nodes are added
  13. new MutationObserver(_update).observe(document.body, { subtree: true, childList: true });
  14. // Initial update
  15. _update();
  16. }
  17. function _update() {
  18. var url = window.location.href;
  19. document.querySelectorAll('a.nav-link:not([data-bs-toggle]), a.dropdown-item').forEach(function(elem) {
  20. elem.classList.toggle('active', elem.href == url || elem.href == url.split("?")[0].split("#")[0]);
  21. });
  22. document.querySelectorAll('a.dropdown-item.active').forEach(function(elem) {
  23. var theItem = elem.closest('.nav-item.dropdown');
  24. if (theItem) {
  25. var theToggle = theItem.querySelector('.dropdown-toggle');
  26. if (theToggle) {
  27. theToggle.classList.toggle('active');
  28. }
  29. }
  30. });
  31. }
  32. })()