diff --git a/web/viewer.css b/web/viewer.css
index f771fd7e6..acaca9865 100644
--- a/web/viewer.css
+++ b/web/viewer.css
@@ -52,6 +52,9 @@ body {
   -webkit-transition-duration: 200ms;
   -webkit-transition-timing-function: ease;
 }
+#outerContainer.sidebarMoving > #sidebarContainer {
+  visibility: visible;
+}
 #outerContainer.sidebarOpen > #sidebarContainer {
   visibility: visible;
   left: 0px;
diff --git a/web/viewer.js b/web/viewer.js
index 9822f07c6..35b00b331 100644
--- a/web/viewer.js
+++ b/web/viewer.js
@@ -1353,18 +1353,21 @@ window.addEventListener('load', function webViewerLoad(evt) {
   thumbsView.addEventListener('scroll', updateThumbViewArea, true);
 
   var mainContainer = document.getElementById('mainContainer');
+  var outerContainer = document.getElementById('outerContainer');
   mainContainer.addEventListener('transitionend', function(e) {
     if (e.target == mainContainer) {
       var event = document.createEvent('UIEvents');
       event.initUIEvent('resize', false, false, window, 0);
       window.dispatchEvent(event);
+      outerContainer.classList.remove('sidebarMoving');
     }
   }, true);
 
   document.getElementById('sidebarToggle').addEventListener('click',
     function() {
       this.classList.toggle('toggled');
-      document.getElementById('outerContainer').classList.toggle('sidebarOpen');
+      outerContainer.classList.add('sidebarMoving');
+      outerContainer.classList.toggle('sidebarOpen');
       updateThumbViewArea();
     });