1 files changed, 4 insertions, 2 deletions
diff --git a/app/assets/javascripts/vue_shared/components/diff_viewer/viewers/image_diff/onion_skin_viewer.vue b/app/assets/javascripts/vue_shared/components/diff_viewer/viewers/image_diff/onion_skin_viewer.vue
index d714ceb3a2f..efcc39197b0 100644
--- a/app/assets/javascripts/vue_shared/components/diff_viewer/viewers/image_diff/onion_skin_viewer.vue
+++ b/app/assets/javascripts/vue_shared/components/diff_viewer/viewers/image_diff/onion_skin_viewer.vue
@@ -28,7 +28,7 @@ export default {
       onionOldImgInfo: null,
       onionNewImgInfo: null,
       onionDraggerPos: 0,
-      onionOpacity: 0,
+      onionOpacity: 1,
       dragging: false,
     };
   },
@@ -82,7 +82,9 @@ export default {
           this.onionNewImgInfo.renderedHeight,
         );
 
-        this.onionOpacity = 0;
+        this.onionOpacity = 1;
+        this.onionDraggerPos =
+          this.$refs.dragTrack.clientWidth - this.$refs.dragger.clientWidth || 100;
 
         document.body.addEventListener('mouseup', this.stopDrag);
       }