خرید هاست ارزدیجیتال
حراجی دامنه های ویژهمشاهده





تبلیغات
تبلیغات تبلیغات
تبلیغات ژاکت, مرجع خرید قالب و افزونه وردپرسی اورجینال

دانلود اسلایدر لمسی و ریسپانسیو Owl Carousel

CSS , اسلایدر , اسکریپت ها

Owl Carousel نام اسلایدر لمسی و فول ریسپانسیو (واکنش گرا) می باشد که شما با استفاده از این اسلاید شو می توانید در سایت خود تصاویر خود را بصورت اسلایدر به کاربران خود نمایش دهید. جهت مشاهده پیش نمایش ، آموزش استفاده و دانلود اسلایدشو با ما باشید.

 

دانلود اسلایدر لمسی و ریسپانسیو Owl Carousel

 

آموزش استفاده از Owl Carousel :

  • ابتدا فایل های زیر را در فایل هدر خود قبل از کد </head> فراخوانی کنید.
    <link href="assets/css/bootstrapTheme.css" rel="stylesheet" />
    <link href="assets/css/custom.css" rel="stylesheet" />
    <link href="owl-carousel/owl.carousel.css" rel="stylesheet" />
    <link href="owl-carousel/owl.theme.css" rel="stylesheet" />
    <link href="assets/js/google-code-prettify/prettify.css" rel="stylesheet" />
    <script src="assets/js/bootstrap-collapse.js"></script>
    <script src="assets/js/bootstrap-transition.js"></script>
    <script src="assets/js/bootstrap-tab.js"></script>
    <script src="assets/js/google-code-prettify/prettify.js"></script>
    <script src="assets/js/application.js"></script>
    <script src="assets/js/jquery-1.9.1.min.js"></script>
    <script src="owl-carousel/owl.carousel.js"></script>
<style>

#owl-demo .item img{
        display: block;
        width: 100%;
        height: auto;
}
</style>
<script>
    $(document).ready(function() {
      $("#owl-demo").owlCarousel({
      navigation : true,
      slideSpeed : 300,
      paginationSpeed : 400,
      items : 1,
      itemsDesktop : false,
      itemsDesktopSmall : false,
      itemsTablet: false,
      itemsMobile : false
      });
    });
</script>
  •  سپس در هر جایی از قالب خود که میخواهید کد های زیر رو جهت نمایش اسلایدشو درج کنید.
      <div id="demo">
        <div class="container">
          <div class="row">
            <div class="span12">
              <div id="owl-demo" class="owl-carousel">
 
                <div class="item"><img src="assets/fullimage1.jpg" alt="The Last of us"></div>
                <div class="item"><img src="assets/fullimage2.jpg" alt="GTA V"></div>
                <div class="item"><img src="assets/fullimage3.jpg" alt="Mirror Edge"></div>
 
              </div>
            </div>
          </div>
        </div>
    </div>

موفق باشید.

این مقاله چقدر براتون مفید بود؟

از ۱ تا ۵ امتیاز بدید.

میانگین رتبه 4.5 / 5. تعداد رای : 4

تا حالا کسی رای نداده! اولین نفر شما باشید.

دانلود

هاست ارزان، لایت اسپید، سرور مجازی منطبق با اسکریپت های 20script کلیک کنید >

خرید ارز
مطلب مفیدی بود ؟
نویسنده : تیم محتوای 20اسکریپت 4 CSS , اسلایدر , اسکریپت ها
لینک کوتاه مطلب : https://www.20script.ir/?p=12992
کلمات کلیدی پست :
مطالب مرتبط
14,542اسکریپت دانلودر ویدئو از شبکه های اجتماعی Video Downloader Script تاریخ : 2018/08/2
12,009اسلایدر بسیار زیبا با پشتیبانی صوتی A-Slider تاریخ : 2014/02/4
18,584اسکریپت حراجی و مزایده آنلاین PHP Pro Bid نسخه 7.3 تاریخ : 2015/09/13
27,009اسکریپت شبکه اجتماعی Sharetronix فارسی نسخه ۱,۵,۳ طلایی تاریخ : 2014/05/9
13,033افزونه برترین ارسال های کاربر برای شیرترانیکس تاریخ : 2014/05/7
11,165اسکریپت سیستم مدیریت محتوای Yellow CMS تاریخ : 2014/11/26
11,451اسکریپت ایجاد و مدیریت پرتال ویدئو SecondTube تاریخ : 2016/03/20
17,772اسکریپت فروشگاه ساز پرستاشاپ فارسی نسخه 1.6.1.7 تاریخ : 2016/12/11
17,207اسکریپت ساخت مستندات و داکیومنت Documentation Builder تاریخ : 2017/02/27
13,500افزونه افزودن آسان نقشه گوگل با MapPress Easy Google Maps تاریخ : 2016/05/6
13,566اسکریپت جی کوئری بنر های اسلایدی با طرح کاشی تاریخ : 2016/06/1
10,099اسکریپت اشتراک گذاری عکس و ویدئو Ninja Media Script تاریخ : 2014/03/4
برخی از قالب های وبلاگ - بیست اسکریپت
قالب عشق بین انگشت هاقالب عشق بین انگشت ها
قالب دخترونه و آرایشقالب دخترونه و آرایش
قالب زیبای ماشینقالب زیبای ماشین
قالب فانتزی و طنز چِشمقالب فانتزی و طنز چِشم
قالب دختر رویاییقالب دختر رویایی
قالب وبلاگ دکوراسیونقالب وبلاگ دکوراسیون
قالب وبلاگ کلبه و درختقالب وبلاگ کلبه و درخت
قالب دختر زیباقالب دختر زیبا
قالب پسرونه غمگینقالب پسرونه غمگین
قالب عاشقانه قلبقالب عاشقانه قلب
بیست اسکریپت
اسکریپت
profile
sourceforge
profile webmaster
profile check
checker list
checker
checker
upload file