<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="//code.jquery.com/jquery-1.11.1.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);