<link href="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/js/bootstrap.min.js"></script> <script src="//cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> <!------ Include the above in your HEAD tag ----------> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/OwlCarousel2/2.3.4/assets/owl.carousel.min.css"> <section class="pt-120 pb-115" id='app'> <div class="app-scrin-inner"> <div class="app-carousel-inner"> <div class="app-carousel owl-carousel"> <div class="single-app-image"> <img src="http://layerdrops.com/jironis/assets/img/feature/app-img.png" data-rjs="2" alt=""> </div> <div class="single-app-image"> <img src="http://layerdrops.com/jironis/assets/img/feature/app-img2.png" data-rjs="2" alt=""> </div> <div class="single-app-image"> <img src="http://layerdrops.com/jironis/assets/img/feature/app-img3.png" data-rjs="2" alt=""> </div> <div class="single-app-image"> <img src="http://layerdrops.com/jironis/assets/img/feature/app-img4.png" data-rjs="2" alt=""> </div> <div class="single-app-image"> <img src="http://layerdrops.com/jironis/assets/img/feature/app-img5.png" data-rjs="2" alt=""> </div> </div> </div> </div> </section> <script src="https://cdnjs.cloudflare.com/ajax/libs/parsley.js/2.8.1/parsley.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/OwlCarousel2/2.3.4/owl.carousel.min.js"></script>

.pt-120 { padding-top: 120px; } .pb-115{ padding-bottom: 115px; } .app-scrin-inner { position: relative; overflow: hidden; max-width: 1500px; margin: 0 auto; padding: 0px 20px; margin-top: -72px; } .app-carousel-inner { position: relative; width: 450px; height: 770px; margin: 0 auto; padding: 108px 70px; background: url(http://layerdrops.com/jironis/assets/img/feature/mockup.png); margin-top: 12px; } .app-carousel .owl-stage-outer { overflow: visible; } .app-carousel .single-app-image img { display: block; width: 90%; height: 95%; margin: 40px auto; top: 20px; } .app-carousel button.owl-dot { height: 7px; width: 7px; background: #ded7f4 !important; margin-right: 5px; border-radius: 50%; -webkit-transition: .3s all linear; transition: .3s all linear; line-height: 10px; vertical-align: middle; } .app-carousel button.owl-dot.active{ background: #5b39c9 !important; height: 10px; width: 10px; } .app-carousel .owl-dots { text-align: center; margin-top: 84px; }

(function($){$.fn.menumaker=function(options){var cssmenu=$(this),settings=$.extend({title:"Menu",format:"dropdown",sticky:false},options);return this.each(function(){cssmenu.prepend('<div id="menu-button">'+settings.title+'</div>');$(this).find("#menu-button").on('click',function(){$(this).toggleClass('menu-opened');var mainmenu=$(this).next('ul');if(mainmenu.hasClass('open')){mainmenu.slideUp('fast').removeClass('open');}else{mainmenu.slideDown('fast').addClass('open');if(settings.format==="dropdown"){mainmenu.find('ul').slideDown();}}});cssmenu.find('li ul').parent().addClass('has-sub-item');multiTg=function(){cssmenu.find(".has-sub-item").prepend('<span class="submenu-button"></span>');cssmenu.find('.submenu-button').on('click',function(){$(this).toggleClass('submenu-opened');if($(this).siblings('ul').hasClass('open')){$(this).siblings('ul').removeClass('open').slideUp('fast');}else{$(this).siblings('ul').addClass('open').slideDown('fast');}});};if(settings.format==='multitoggle')multiTg();else cssmenu.addClass('dropdown');if(settings.sticky===true)cssmenu.css('position','fixed');resizeFix=function(){if($(window).width()>992){cssmenu.find('ul').show();} if($(window).width()<992){cssmenu.find('ul').hide().removeClass('open');}};resizeFix();return $(window).on('resize',resizeFix);});};})(jQuery); (function($) { "use strict"; /* 01: Main menu ==============================================*/ $('.header-menu a[href="#"]').on('click', function(event) { event.preventDefault(); }); $(".header-menu").menumaker({ title: '<i class="fa fa-bars"></i>', format: "multitoggle" }); var mainHeader = $('.main-header'); if($(window).scrollTop() > 100) $('.main-header').addClass('sticky fadeInDown') $(window).on('scroll', function(e){ if($(this).scrollTop() < 100){ $('.main-header').removeClass('sticky fadeInDown') }else $('.main-header').addClass('sticky fadeInDown') }); /* 02: Background image ==============================================*/ var bgImg = $('[data-bg-img]'); bgImg.css('background', function(){ return 'url(' + $(this).data('bg-img') + ') center center'; }); /* 03: Parsley form validation ==============================================*/ $('.parsley-validate, .parsley-validate form').parsley(); /*============================================ 04: Back to top button ==============================================*/ var $backToTopBtn = $('.back-to-top'); if ($backToTopBtn.length) { var scrollTrigger = 400, // px backToTop = function () { var scrollTop = $(window).scrollTop(); if (scrollTop > scrollTrigger) { $backToTopBtn.addClass('show'); } else { $backToTopBtn.removeClass('show'); } }; backToTop(); $(window).on('scroll', function () { backToTop(); }); $backToTopBtn.on('click', function (e) { e.preventDefault(); $('html,body').animate({ scrollTop: 0 }, 700); }); } /*========================================== 14: feature-carousel ===========================================*/ $('.feature-carousel').owlCarousel({ loop: true, margin: 30, center: true, dots:true, autoplay: true, autoplayTimeout: 4000, responsive: { 0: { items: 1, }, 575: { items: 1, }, 768: { items: 2 }, 991: { items: 2 }, 992: { items: 3 } } }) /* ================================================= app carousel ================================================= */ $('.app-carousel').owlCarousel({ loop: true, margin: 30, center: true, dots: true, responsive: { 0: { items: 1 }, 575: { items: 1 }, 700: { items: 1 }, 1000: { items: 1 } } }) /*============================================= 05: Changing svg color ==============================================*/ jQuery('img.svg').each(function(){ var $img = jQuery(this); var imgID = $img.attr('id'); var imgClass = $img.attr('class'); var imgURL = $img.attr('src'); jQuery.get(imgURL, function(data) { // Get the SVG tag, ignore the rest var $svg = jQuery(data).find('svg'); // Add replaced image's ID to the new SVG if(typeof imgID !== 'undefined') { $svg = $svg.attr('id', imgID); } // Add replaced image's classes to the new SVG if(typeof imgClass !== 'undefined') { $svg = $svg.attr('class', imgClass+' replaced-svg'); } // Remove any invalid XML tags as per http://validator.w3.org $svg = $svg.removeAttr('xmlns:a'); // Check if the viewport is set, else we gonna set it if we can. if(!$svg.attr('viewBox') && $svg.attr('height') && $svg.attr('width')) { $svg.attr('viewBox', '0 0 ' + $svg.attr('height') + ' ' + $svg.attr('width')); } // Replace image with new SVG $img.replaceWith($svg); }, 'xml'); }); /*============================================= 06: Ajax Contact Form ==============================================*/ $('.contact-form').on('submit', 'form', function(e) { e.preventDefault(); var $el = $(this); $.post($el.attr('action'), $el.serialize(), function(res){ res = $.parseJSON( res ); $el.parent('.contact-page-form').find('.form-response').html('<span>' + res[1] + '</span>'); }); }); /*============================================ 07: Preloader ==============================================*/ $(window).on('load', function(){ function removePreloader() { var preLoader = $('.preLoader'); preLoader.fadeOut(); } setTimeout(removePreloader, 250); }); /* 08: Content animation ==============================================*/ $(window).on('load', function(){ var $animateEl = $('[data-animate]'); $animateEl.each(function () { var $el = $(this), $name = $el.data('animate'), $duration = $el.data('duration'), $delay = $el.data('delay'); $duration = typeof $duration === 'undefined' ? '0.6' : $duration ; $delay = typeof $delay === 'undefined' ? '.1' : $delay ; $el.waypoint(function () { $el.addClass('animated ' + $name) .css({ 'animation-duration': $duration + 's', 'animation-delay': $delay + 's' }); }, {offset: '93%'}); }); }); /*========================================================= 09: counter up =========================================================*/ $('.counter').counterUp({}); /*==================================================== 10: Parallax ====================================================*/ var $parallaxLayers = $('[data-trigger="parallax_layers"]'); if( $parallaxLayers.length ){ $parallaxLayers.each(function () { new Parallax( $(this)[0], { selector: '[data-depth]' }); }); } /* 16: video popup */ var t = $(".video-btn"); t.length && t.magnificPopup({ type: "iframe" }) // parice tabele $('.single-price-plan').on('mouseenter', function(){ $(this).addClass('active').parent().siblings().find('.single-price-plan').removeClass('active'); }) /*===================================================== 13: partner carousel =====================================================*/ $('.partner-carousel').owlCarousel({ loop: true, margin: 20, nav: false, dots: false, autoplay:true, autoplayTimeout:4000, autoplaySpeed:3000, responsive: { 0: { items: 1 }, 500: { items: 3 }, 768: { items: 4 }, 992: { items: 5 } } }) /* scroll */ $(".header-menu ul li a").on("click", function(t) { var c = $(this.hash); if(c.length !==0 ){ $("html,body").animate({ scrollTop: c.offset().top }, 700); } }) /*===================================================== 13: partner carousel =====================================================*/ let author = $('.author-carousel') author.owlCarousel({ loop: true, margin: 20, nav: true, center:true, dots: false, responsive: { 0: { items: 1 }, 500: { items: 1 }, 768: { items: 1 }, 992: { items: 1 } } }) let author_cumment = $('.author-comment-carousel'); author_cumment.owlCarousel({ loop: true, margin: 20, nav: true, navText: ['<i class="fa fa-angle-left">', '<i class="fa fa-angle-right">'], dots: false, responsive: { 0: { items: 1 }, 500: { items: 1 }, 768: { items: 1 }, 992: { items: 1 } } }); $('.author-comment-carousel .owl-next').on('click', function () { $('.author-carousel .owl-next').click() }); $('.author-comment-carousel .owl-prev').on('click', function () { $('.author-carousel .owl-prev').click() }); // banner 2 logo bgs $(window).on('resize', () =>{ if ($(window).width() >= 975 ){ $('.main-header.header-2 .logo .main-logo2').attr('src', 'assets/img/logo2.png') } else if ($(window).width() <=975) { $('.main-header.header-2 .logo .main-logo2').attr('src', 'assets/img/logo.png') } }) if ($(window).width() >=975) { $('.main-header.header-2 .logo .main-logo2').attr('src', 'assets/img/logo2.png') } else if ($(window).width() <=975){ $('.main-header.header-2 .logo .main-logo2').attr('src', 'assets/img/logo.png') } })(jQuery);