Hide menu on load

mmistakes · May 22, 2015 · 7b6be81 · 7b6be81
1 parent 7f306ce
commit 7b6be81
Show file tree

Hide file tree

Showing 2 changed files with 15 additions and 2 deletions.
diff --git a/_assets/stylesheets/_sliding-menu.scss b/_assets/stylesheets/_sliding-menu.scss
@@ -30,11 +30,12 @@
   height: 100%;
   transform: translateX(100%);
   transition: $sliding-menu-animation;
-  background: $sliding-menu-background; // fallback
-  // background: rgba($sliding-menu-background,0.85);
+  background: $sliding-menu-background;
+  opacity: 0; // hide menu on load
   z-index: 50;
   -webkit-overflow-scrolling: touch;
   &.is-visible {
+    opacity: 1;
     transform: translateX(0);
   }
   ul,

diff --git a/_layouts/default.html b/_layouts/default.html
@@ -63,6 +63,18 @@
       {% javascript vendor/respond %}
     <![endif]-->
 
+    <!-- menu fix for old IE -->
+    <!--[if lt IE 9]>
+    <style>
+      .sliding-menu-content {
+        display: none;
+      }
+      .sliding-menu-content.is-visible {
+        display: block;
+      }
+    </style>
+    <![endif]-->
+
     <link rel="apple-touch-icon" sizes="57x57" href="{{ site.url }}/apple-touch-icon-57x57.png">
     <link rel="apple-touch-icon" sizes="60x60" href="{{ site.url }}/apple-touch-icon-60x60.png">
     <link rel="apple-touch-icon" sizes="72x72" href="{{ site.url }}/apple-touch-icon-72x72.png">