diff --git a/frontend/components/global/product-detail/Slider.vue b/frontend/components/global/product-detail/Slider.vue
index 1cb2b26..273d5e5 100644
--- a/frontend/components/global/product-detail/Slider.vue
+++ b/frontend/components/global/product-detail/Slider.vue
@@ -57,12 +57,17 @@ const changeSlide = (id: number) => {
                     name="zoom"
                     mode="out-in"
                 >
-                    <NuxtImg
-                        :key="selectedSlideDetail.id"
-                        class="size-full absolute object-contain"
-                        :src="selectedSlideDetail.image"
-                        :alt="selectedSlideDetail.name"
-                    />
+                    <div :key="selectedSlideDetail.id">
+                        <vue-image-zoomer
+                            class="size-full absolute object-contain"
+                            :show-message="false"
+                            :show-message-touch="false"
+                            click-message="برای مشاهده کلیک کنید"
+                            hover-message="برای مشاهده موس را وارد عکس کنید"
+                            :regular="selectedSlideDetail.image"
+                            :alt="selectedSlideDetail.name"
+                        />
+                    </div>
                 </Transition>
             </div>