mirror of
https://github.com/pure-css/pure.git
synced 2024-11-07 21:34:24 +00:00
Fix email layout menu link (#848)
This commit is contained in:
parent
503265cc51
commit
a36ac17fc6
@ -12,7 +12,7 @@
|
|||||||
|
|
||||||
<div id="layout" class="content pure-g">
|
<div id="layout" class="content pure-g">
|
||||||
<div id="nav" class="pure-u">
|
<div id="nav" class="pure-u">
|
||||||
<a href="#" class="nav-menu-button">Menu</a>
|
<a href="#" id="menuLink" class="nav-menu-button">Menu</a>
|
||||||
|
|
||||||
<div class="nav-inner">
|
<div class="nav-inner">
|
||||||
<button class="primary-button pure-button">Compose</button>
|
<button class="primary-button pure-button">Compose</button>
|
||||||
@ -171,6 +171,56 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
<!-- Script to make the Menu link work -->
|
||||||
|
<!-- Just stripped down version of the js/ui.js script for the side-menu layout -->
|
||||||
|
<script>
|
||||||
|
function getElements() {
|
||||||
|
return {
|
||||||
|
menu: document.getElementById('nav'),
|
||||||
|
menuLink: document.getElementById('menuLink')
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
function toggleClass(element, className) {
|
||||||
|
var classes = element.className.split(/\s+/);
|
||||||
|
var length = classes.length;
|
||||||
|
var i = 0;
|
||||||
|
|
||||||
|
for (; i < length; i++) {
|
||||||
|
if (classes[i] === className) {
|
||||||
|
classes.splice(i, 1);
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
// The className is not found
|
||||||
|
if (length === classes.length) {
|
||||||
|
classes.push(className);
|
||||||
|
}
|
||||||
|
|
||||||
|
element.className = classes.join(' ');
|
||||||
|
}
|
||||||
|
|
||||||
|
function toggleMenu() {
|
||||||
|
var active = 'active';
|
||||||
|
var elements = getElements();
|
||||||
|
|
||||||
|
toggleClass(elements.menu, active);
|
||||||
|
}
|
||||||
|
|
||||||
|
function handleEvent(e) {
|
||||||
|
var elements = getElements();
|
||||||
|
|
||||||
|
if (e.target.id === elements.menuLink.id) {
|
||||||
|
toggleMenu();
|
||||||
|
e.preventDefault();
|
||||||
|
} else if (elements.menu.className.indexOf('active') !== -1) {
|
||||||
|
toggleMenu();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
document.addEventListener('DOMContentLoaded', function () {
|
||||||
|
document.addEventListener('click', handleEvent);
|
||||||
|
});
|
||||||
|
</script>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
Loading…
Reference in New Issue
Block a user