diff --git a/calendar/templates/month_detailed.mustache b/calendar/templates/month_detailed.mustache
index 34627ea6c78..3ebebaae431 100644
--- a/calendar/templates/month_detailed.mustache
+++ b/calendar/templates/month_detailed.mustache
@@ -157,10 +157,26 @@ require([
         M.util.js_pending("month-detailed-{{uniqid}}-filterChanged");
         // A filter value has been changed.
         // Find all matching cells in the popover data, and hide them.
-        $("#month-detailed-{{uniqid}}")
-            .find(CalendarSelectors.eventType[data.type])
-            .toggleClass('hidden', !!data.hidden);
-        M.util.js_complete("month-detailed-{{uniqid}}-filterChanged");
+        var target = $("#month-detailed-{{uniqid}}").find(CalendarSelectors.eventType[data.type]);
+
+        var transitionPromise = $.Deferred();
+        if (data.hidden) {
+            transitionPromise.then(function() {
+                return target.slideUp('fast').promise();
+            });
+        } else {
+            transitionPromise.then(function() {
+                return target.slideDown('fast').promise();
+            });
+        }
+
+        transitionPromise.then(function() {
+            M.util.js_complete("month-detailed-{{uniqid}}-filterChanged");
+
+            return;
+        });
+
+        transitionPromise.resolve();
     });
 });
 {{/js}}