@dotcomet’s original approach is the most performant, and one that (ultimately) works better on mobile devices (imho). I think the code snippet that you’re looking for is:
<nav class="nav" style="{{getNavStyling}}">
<template name="navigation">
<a href="{{pathFor 'home}}">Home</a>
<a href="{{pathFor 'nutrition}}">Nutrition</a>
</nav>
<button type="button" class="hamburger">hidemenue</button>
</template>
Session.setDefault('navbarOpen', true);
Template.navigation.events({
'click .hamburger': function(){
Session.toggle('navbarOpen');
}
});
Template.navigation.helpers({
getNavStyling: function(){
if(Session.get('navbarOpen'){
return "visibility: visible; opacity: 1";
} else {
return "visibility: hidden; opacity: 0";
}
}
});