diff --git a/src/addons/messages/pages/discussion/discussion.page.ts b/src/addons/messages/pages/discussion/discussion.page.ts
index e107f5756..e9eb9b880 100644
--- a/src/addons/messages/pages/discussion/discussion.page.ts
+++ b/src/addons/messages/pages/discussion/discussion.page.ts
@@ -163,9 +163,16 @@ export class AddonMessagesDiscussionPage implements OnInit, OnDestroy, AfterView
         this.showInfo = !backViewPage || !CoreTextUtils.matchesGlob(backViewPage, '**/user/profile');
 
         this.route.queryParams.subscribe(async (params) => {
-            this.loaded = false;
+            const oldConversationId = this.conversationId;
+            const oldUserId = this.userId;
             this.conversationId = CoreNavigator.getRouteNumberParam('conversationId', { params }) || undefined;
             this.userId = CoreNavigator.getRouteNumberParam('userId', { params }) || undefined;
+
+            if (oldConversationId != this.conversationId || oldUserId != this.userId) {
+                // Showing reload again can break animations.
+                this.loaded = false;
+            }
+
             this.showKeyboard = CoreNavigator.getRouteBooleanParam('showKeyboard', { params }) || false;
 
             await this.fetchData();
diff --git a/src/core/components/animations.ts b/src/core/components/animations.ts
index e9a3ebd4b..0f5d36215 100644
--- a/src/core/components/animations.ts
+++ b/src/core/components/animations.ts
@@ -33,38 +33,34 @@ export class CoreAnimations {
     static readonly SLIDE_IN_OUT = trigger('coreSlideInOut', [
         // Enter animation.
         transition('void => fromLeft', [
-            style({ transform: 'translateX(0)', opacity: 1 }),
             animate(300, keyframes([
                 style({ opacity: 0, transform: 'translateX(-100%)', offset: 0 }),
                 style({ opacity: 1, transform: 'translateX(5%)', offset: 0.7 }),
-                style({ opacity: 1, transform: 'translateX(0)',     offset: 1.0 }),
+                style({ opacity: 1, transform: 'translateX(0)', offset: 1.0 }),
             ])),
         ]),
         // Leave animation.
         transition('fromLeft => void', [
-            style({ transform: 'translateX(-100%)', opacity: 0 }),
             animate(300, keyframes([
                 style({ opacity: 1, transform: 'translateX(0)', offset: 0 }),
                 style({ opacity: 1, transform: 'translateX(5%)', offset: 0.3 }),
-                style({ opacity: 0, transform: 'translateX(-100%)',     offset: 1.0 }),
+                style({ opacity: 0, transform: 'translateX(-100%)', offset: 1.0 }),
             ])),
         ]),
         // Enter animation.
         transition('void => fromRight', [
-            style({ transform: 'translateX(0)', opacity: 1 }),
             animate(300, keyframes([
-                style({ opacity: 0, transform: 'translateX(100%)',     offset: 0 }),
+                style({ opacity: 0, transform: 'translateX(100%)', offset: 0 }),
                 style({ opacity: 1, transform: 'translateX(-5%)', offset: 0.7 }),
                 style({ opacity: 1, transform: 'translateX(0)', offset: 1.0 }),
             ])),
         ]),
         // Leave animation.
         transition('fromRight => void', [
-            style({ transform: 'translateX(-100%)', opacity: 0 }),
             animate(300, keyframes([
                 style({ opacity: 1, transform: 'translateX(0)', offset: 0 }),
                 style({ opacity: 1, transform: 'translateX(-5%)', offset: 0.3 }),
-                style({ opacity: 0, transform: 'translateX(100%)',     offset: 1.0 }),
+                style({ opacity: 0, transform: 'translateX(100%)', offset: 1.0 }),
             ])),
         ]),
     ]);