library-mirrors/pure
1
0
Fork 0
mirror of https://github.com/pure-css/pure.git synced 2024-11-07 21:34:24 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

fix #809 - remove prevent default to follow links

Browse Source
This commit is contained in:
redonkulus 2021-01-20 11:35:15 -08:00
parent f6dc888942
commit 4c01e2c5ed
2 changed files with 27 additions and 20 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

39
site/static/js/ui.js
View File

@ -1,13 +1,19 @@
(function (window, document) { (function (window, document) {
var layout = document.getElementById('layout'), // we fetch the elements each time because docusaurus removes the previous
menu = document.getElementById('menu'), // element references on page navigation
menuLink = document.getElementById('menuLink'); function getElements() {
return {
layout: document.getElementById('layout'),
menu: document.getElementById('menu'),
menuLink: document.getElementById('menuLink')
};
}
function toggleClass(element, className) { function toggleClass(element, className) {
var classes = element.className.split(/\s+/), var classes = element.className.split(/\s+/);
length = classes.length, var length = classes.length;
i = 0; var i = 0;
for (; i < length; i++) { for (; i < length; i++) {
if (classes[i] === className) { if (classes[i] === className) {
@ -23,22 +29,23 @@
element.className = classes.join(' '); element.className = classes.join(' ');
} }
function toggleAll(e) { function toggleAll() {
var active = 'active'; var active = 'active';
var elements = getElements();
e.preventDefault(); toggleClass(elements.layout, active);
toggleClass(layout, active); toggleClass(elements.menu, active);
toggleClass(menu, active); toggleClass(elements.menuLink, active);
toggleClass(menuLink, active);
} }
function handleEvent(e) { function handleEvent(e) {
if (e.target.id === menuLink.id) { var elements = getElements();
return toggleAll(e);
}
if (menu.className.indexOf('active') !== -1) { if (e.target.id === elements.menuLink.id) {
return toggleAll(e); toggleAll();
e.preventDefault();
} else if (elements.menu.className.indexOf('active') !== -1) {
toggleAll();
} }
} }

8
site/static/layouts/side-menu/index.html
View File

@ -19,17 +19,17 @@
<div id="menu"> <div id="menu">
<div class="pure-menu"> <div class="pure-menu">
<a class="pure-menu-heading" href="#">Company</a> <a class="pure-menu-heading" href="#company">Company</a>
<ul class="pure-menu-list"> <ul class="pure-menu-list">
<li class="pure-menu-item"><a href="#" class="pure-menu-link">Home</a></li> <li class="pure-menu-item"><a href="#home" class="pure-menu-link">Home</a></li>
<li class="pure-menu-item"><a href="#" class="pure-menu-link">About</a></li> <li class="pure-menu-item"><a href="#about" class="pure-menu-link">About</a></li>
<li class="pure-menu-item menu-item-divided pure-menu-selected"> <li class="pure-menu-item menu-item-divided pure-menu-selected">
<a href="#" class="pure-menu-link">Services</a> <a href="#" class="pure-menu-link">Services</a>
</li> </li>
<li class="pure-menu-item"><a href="#" class="pure-menu-link">Contact</a></li> <li class="pure-menu-item"><a href="#contact" class="pure-menu-link">Contact</a></li>
</ul> </ul>
</div> </div>
</div> </div>