سورس کد اسلایدر دیجی کالا
اطلاعات پروژه
| فریلنسر | حسین حسنی |
| نام کاربری | teleskop |
| دسته بندی پروژه | |
| تاریخ ثبت | ۷ آبان ۱۳۹۵ |
| تعداد نظرات | ۲ |
| قیمت |
|
|
|
|
|
امکان خرید از درگاه های بانکی و کیف پول برای دانلود بعد از خرید به همین صفحه برگردید تا لینک های دانلود نمایش داده شود |
|
|
انتشار پروژه ها و مطالب سایت در سایت دیگر ممنوع بوده و پیگرد قانونی دارد |
|
سورس کد اسلایدر دیجی کالا
اسلایدر دیجی کالا
سورس کد اسلایدر دیجی کالا حتی پیشرفته تر
امکان لمسی بودن به اسلایدر اضافه شده.
امکان انتخاب سه حالت برای تعویض تصویر اسلایدر و ...
دقیقا شبیه دیجی کالا
بدون استفاده از افزونه خارجی
کدنویسی کاملا خالص
این فایل به صورت یک پلاگین کدنویسی شده که به راحتی میتونین از اون در پروژه هاتون استفاده کنین و تنظیمات دلخواهتون رو روی اون انجام بدید.
به صورت زیر :
فایل های slider.css و pure.css رو در قسمت head صفحه فراخوانی کنید :
<link rel="stylesheet" href="../common/pure.css"/> <link rel="stylesheet" href="slider.css"/>
سپس کتابخانه جی کویری و جی کویری موبایل و فایل slider.js رو فراخوانی کنید :
<script type="text/javascript" src="../common/jquery-1.11.3.min.js"></script> <script type="text/javascript" src="slider.js"></script> <script type="text/javascript" src="../common/jquery.mobile.custom.min.js"></script>
و در آخر افزونه رو به شکل زیر در کدهای html صفحه صدا بزنید :
به ویژه برای دانشجویان طراحی وب خیلی مناسبه.
$('#slider').djSlider({
navigationSupport: true, // or : false
slideTime: 4000, //ms
autoSlide_outAnimation: 'fade', // or : swipeRight , swipeLeft , fade
speed: 500, // ms
autoSlide_inAnimation: 'fade', // or : swipeRight , swipeLeft , fade
swipeRight_outAnimation: 'swipeRight', // or : swipeRight , swipeLeft , fade
swipeLeft_outAnimation: 'swipeLeft', // or : swipeRight , swipeLeft , fade
swipeRight_inAnimation: 'swipeRight', // or : swipeRight , swipeLeft , fade
swipeLeft_inAnimation: 'swipeLeft', // or : swipeRight , swipeLeft , fade
prevBtn_outAnimation: 'fade', // or : swipeRight , swipeLeft , fade
nextBtn_outAnimation: 'fade', // or : swipeRight , swipeLeft , fade
nextBtn_inAnimation: 'fade', // or : swipeRight , swipeLeft , fade
prevItemCaption_outAnimation: 'fade', // or : swipeRight , swipeLeft , fade
prevBtn_inAnimation: 'fade', // or : swipeRight , swipeLeft , fade
nextItemCaption_outAnimation: 'fade', // or : swipeRight , swipeLeft , fade
prevItemCaption_inAnimation: 'fade', // or : swipeRight , swipeLeft , fade
nextItemCaption_inAnimation: 'fade', // or : swipeRight , swipeLeft , fade
captionSupport: true, // or : false
})
autoSlide: true, // or : false
pauseOnHover: true, // or : false
touchSupport: true // or : false
همچنین میتوانید از نمونه ای که براتون گذاشتم برای یادگیری استفاده کنین.
