سحر صادقی
1 سال پیش توسط سحر صادقی مطرح شد
5 پاسخ

ریسپانسیو کردن کاروسل محصولات

سلام وقت بخیر
برای کاروسل محصولات در حالت نمایشگر موبایل، برای اینکه فقط یک کارت محصول را نشان دهد و همزمان افزایش عرض دهد چه کد css و مدیا کوئری باید نوشت؟
چون در حالت نمایشگر موبایل طبق تصویر زیر دو کارت محصول را نشان می دهد که اصلا وضوح ندارند. در مدیا کوئری که بهش max- width می دهم باعث می شود المان ها روی هم بیافتند .

 تصویر


ثبت پرسش جدید
رایموند
تخصص : مختصص وردپرس - برنامه نویس لار...
@Raymond 1 سال پیش مطرح شد
1

درود خوبی...
کد جاوا اسکریپت:

$('.owl-carousel').owlCarousel({
    loop:true,
    margin:10,
    responsiveClass:true,
    responsive:{
        0:{
            items:1,
            nav:true
        },
        600:{
            items:3,
            nav:false
        },
        1000:{
            items:5,
            nav:true,
            loop:false
        }
    }
})

پیوند زیر :
https://owlcarousel2.github.io/OwlCarousel2/demos/responsive.html
یا از این اسلایدر استفاده کنید:
https://bootsnipp.com/snippets/9kBZp


vahid1379
تخصص : wp developer
@vahid1379 1 سال پیش مطرح شد
0

سلام این کاری که شما میخاید انجام بدید ربطی به css نداره باید با جاوااسکریپت انجام بشه از چه کتابخانه ایی استفاده می‌کنید؟
Swiper
Splide
owlCarousel
یا...


سحر صادقی
@سحر صادقی 1 سال پیش مطرح شد
0

تشکر از شما،
از owlCarousel استفاده شده، البته یک قالب اماده بود که من ویرایشش کردم اما از ابتدا هم این مشکل را داشت.


رایموند
تخصص : مختصص وردپرس - برنامه نویس لار...
@Raymond 1 سال پیش مطرح شد
1

درود خوبی...
کد جاوا اسکریپت:

$('.owl-carousel').owlCarousel({
    loop:true,
    margin:10,
    responsiveClass:true,
    responsive:{
        0:{
            items:1,
            nav:true
        },
        600:{
            items:3,
            nav:false
        },
        1000:{
            items:5,
            nav:true,
            loop:false
        }
    }
})

پیوند زیر :
https://owlcarousel2.github.io/OwlCarousel2/demos/responsive.html
یا از این اسلایدر استفاده کنید:
https://bootsnipp.com/snippets/9kBZp


Hossein
تخصص : طراحی وب سایت
@Locifer2214 1 سال پیش مطرح شد
0

قالب های آماده ر.و از کجا تهیه می کنید؟😅


محمد رضا
تخصص : Full Stack Developer
@salar.mohammad2013 1 سال پیش مطرح شد

برای ارسال پاسخ لازم است وارد شده یا ثبت‌نام کنید

ورود یا ثبت‌نام