416 lines
12 KiB
JavaScript
416 lines
12 KiB
JavaScript
|
/* ============ Main JS ============ */
|
||
|
|
|
||
|
|
(function ($) {
|
||
|
|
"use strict";
|
||
|
|
|
||
|
|
var windowOn = $(window);
|
||
|
|
|
||
|
|
// 01. PreLoader Js
|
||
|
|
$(window).on("load", function (event) {
|
||
|
|
$(".preloader").delay(500).fadeOut(500);
|
||
|
|
});
|
||
|
|
$(document).ready(function() {
|
||
|
|
|
||
|
|
var headerArea = $(".sticky-active .primary-header"),
|
||
|
|
headerClone = headerArea.clone();
|
||
|
|
|
||
|
|
function menuSticky(w) {
|
||
|
|
if (w.matches) {
|
||
|
|
$(".header").after('<div class="sticky-header-wrap"></div>');
|
||
|
|
$(".sticky-header-wrap").html(headerClone);
|
||
|
|
$(window).on("scroll", function () {
|
||
|
|
var headerSelector = $(".sticky-header-wrap");
|
||
|
|
var scroll = $(window).scrollTop();
|
||
|
|
if (scroll >= 110) {
|
||
|
|
headerSelector.addClass("fixed");
|
||
|
|
} else {
|
||
|
|
headerSelector.removeClass("fixed");
|
||
|
|
}
|
||
|
|
});
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
var minWidth = window.matchMedia("(min-width: 992px)");
|
||
|
|
if ($(".header").hasClass("sticky-active")) {
|
||
|
|
menuSticky(minWidth);
|
||
|
|
} else {
|
||
|
|
windowOn.on("scroll", function () {
|
||
|
|
var scroll = $(window).scrollTop();
|
||
|
|
if (scroll < 100) {
|
||
|
|
$(".header").removeClass("header__sticky");
|
||
|
|
} else {
|
||
|
|
$(".header").addClass("header__sticky");
|
||
|
|
}
|
||
|
|
});
|
||
|
|
}
|
||
|
|
|
||
|
|
//Mobile Menu Js
|
||
|
|
$(".mobile-menu-items").meanmenu({
|
||
|
|
meanMenuContainer: ".side-menu-wrap",
|
||
|
|
meanScreenWidth: "991",
|
||
|
|
meanMenuCloseSize: "30px",
|
||
|
|
meanRemoveAttrs: true,
|
||
|
|
meanExpand: ['<i class="fa-solid fa-caret-down"></i>'],
|
||
|
|
});
|
||
|
|
|
||
|
|
// Mobile Sidemenu
|
||
|
|
$(".mobile-side-menu-toggle").on("click", function () {
|
||
|
|
$(".mobile-side-menu, .mobile-side-menu-overlay").toggleClass("is-open");
|
||
|
|
});
|
||
|
|
|
||
|
|
$(".mobile-side-menu-close, .mobile-side-menu-overlay").on("click", function () {
|
||
|
|
$(".mobile-side-menu, .mobile-side-menu-overlay").removeClass("is-open");
|
||
|
|
});
|
||
|
|
|
||
|
|
// Popup Search Box
|
||
|
|
$(function () {
|
||
|
|
$("#popup-search-box").removeClass("toggled");
|
||
|
|
|
||
|
|
$(".dl-search-icon").on("click", function (e) {
|
||
|
|
e.stopPropagation();
|
||
|
|
$("#popup-search-box").toggleClass("toggled");
|
||
|
|
$("#popup-search").focus();
|
||
|
|
});
|
||
|
|
|
||
|
|
$("#popup-search-box input").on("click", function (e) {
|
||
|
|
e.stopPropagation();
|
||
|
|
});
|
||
|
|
|
||
|
|
$("#popup-search-box, body").on("click", function () {
|
||
|
|
$("#popup-search-box").removeClass("toggled");
|
||
|
|
});
|
||
|
|
});
|
||
|
|
|
||
|
|
// Popup Sidebox
|
||
|
|
function sideBox() {
|
||
|
|
$("body").removeClass("open-sidebar");
|
||
|
|
$(document).on("click", ".sidebar-trigger", function (e) {
|
||
|
|
e.preventDefault();
|
||
|
|
$("body").toggleClass("open-sidebar");
|
||
|
|
});
|
||
|
|
$(document).on("click", ".sidebar-trigger.close, #sidebar-overlay", function (e) {
|
||
|
|
e.preventDefault();
|
||
|
|
$("body.open-sidebar").removeClass("open-sidebar");
|
||
|
|
});
|
||
|
|
}
|
||
|
|
|
||
|
|
sideBox();
|
||
|
|
|
||
|
|
// Venobox Video
|
||
|
|
new VenoBox({
|
||
|
|
selector: ".video-popup, .img-popup",
|
||
|
|
bgcolor: "transparent",
|
||
|
|
numeration: true,
|
||
|
|
infinigall: true,
|
||
|
|
spinner: "plane",
|
||
|
|
});
|
||
|
|
|
||
|
|
// Data Background
|
||
|
|
$("[data-background").each(function () {
|
||
|
|
$(this).css("background-image", "url( " + $(this).attr("data-background") + " )");
|
||
|
|
});
|
||
|
|
|
||
|
|
/* Odometer */
|
||
|
|
$(".odometer").waypoint(
|
||
|
|
function () {
|
||
|
|
var odo = $(".odometer");
|
||
|
|
odo.each(function () {
|
||
|
|
var countNumber = $(this).attr("data-count");
|
||
|
|
$(this).html(countNumber);
|
||
|
|
});
|
||
|
|
},
|
||
|
|
{
|
||
|
|
offset: "80%",
|
||
|
|
triggerOnce: true,
|
||
|
|
}
|
||
|
|
);
|
||
|
|
|
||
|
|
// Wow JS Active
|
||
|
|
new WOW().init();
|
||
|
|
|
||
|
|
// Isotop
|
||
|
|
$(".filter-items").imagesLoaded(function () {
|
||
|
|
// Add isotope click function
|
||
|
|
$(".project-filter li").on("click", function () {
|
||
|
|
$(".project-filter li").removeClass("active");
|
||
|
|
$(this).addClass("active");
|
||
|
|
|
||
|
|
var selector = $(this).attr("data-filter");
|
||
|
|
$(".filter-items").isotope({
|
||
|
|
filter: selector,
|
||
|
|
animationOptions: {
|
||
|
|
duration: 750,
|
||
|
|
easing: "linear",
|
||
|
|
queue: false,
|
||
|
|
},
|
||
|
|
});
|
||
|
|
return false;
|
||
|
|
});
|
||
|
|
|
||
|
|
$(".filter-items").isotope({
|
||
|
|
itemSelector: ".single-item",
|
||
|
|
layoutMode: "fitRows",
|
||
|
|
fitRows: {
|
||
|
|
gutter: 0,
|
||
|
|
},
|
||
|
|
});
|
||
|
|
});
|
||
|
|
|
||
|
|
// Price range slider
|
||
|
|
var priceRange = $("#price-range"),
|
||
|
|
priceOutput = $("#price-output span");
|
||
|
|
priceOutput.html(priceRange.val());
|
||
|
|
priceRange.on("change input", function () {
|
||
|
|
priceOutput.html($(this).val());
|
||
|
|
});
|
||
|
|
|
||
|
|
// Sponsor Carousel
|
||
|
|
var swiperSponsor = new Swiper(".sponsor-carousel", {
|
||
|
|
slidesPerView: 45,
|
||
|
|
spaceBetween: 50,
|
||
|
|
slidesPerGroup: 1,
|
||
|
|
loop: true,
|
||
|
|
autoplay: true,
|
||
|
|
grabCursor: true,
|
||
|
|
speed: 400,
|
||
|
|
breakpoints: {
|
||
|
|
320: {
|
||
|
|
slidesPerView: 2,
|
||
|
|
slidesPerGroup: 1,
|
||
|
|
spaceBetween: 25,
|
||
|
|
},
|
||
|
|
767: {
|
||
|
|
slidesPerView: 3,
|
||
|
|
slidesPerGroup: 1,
|
||
|
|
spaceBetween: 30,
|
||
|
|
},
|
||
|
|
1024: {
|
||
|
|
slidesPerView: 5,
|
||
|
|
slidesPerGroup: 1,
|
||
|
|
},
|
||
|
|
},
|
||
|
|
});
|
||
|
|
|
||
|
|
// Sponsor Carousel
|
||
|
|
var swiperSponsor = new Swiper(".sponsor-carousel-2", {
|
||
|
|
slidesPerView: 45,
|
||
|
|
spaceBetween: 50,
|
||
|
|
slidesPerGroup: 1,
|
||
|
|
loop: true,
|
||
|
|
autoplay: true,
|
||
|
|
grabCursor: true,
|
||
|
|
speed: 400,
|
||
|
|
breakpoints: {
|
||
|
|
320: {
|
||
|
|
slidesPerView: 2,
|
||
|
|
slidesPerGroup: 1,
|
||
|
|
spaceBetween: 25,
|
||
|
|
},
|
||
|
|
767: {
|
||
|
|
slidesPerView: 3,
|
||
|
|
slidesPerGroup: 1,
|
||
|
|
spaceBetween: 30,
|
||
|
|
},
|
||
|
|
1024: {
|
||
|
|
slidesPerView: 4,
|
||
|
|
slidesPerGroup: 1,
|
||
|
|
},
|
||
|
|
},
|
||
|
|
});
|
||
|
|
|
||
|
|
// Project Carousel
|
||
|
|
var swiperProject = new Swiper(".project-carousel", {
|
||
|
|
slidesPerView: 3,
|
||
|
|
spaceBetween: 25,
|
||
|
|
slidesPerGroup: 1,
|
||
|
|
loop: true,
|
||
|
|
autoplay: true,
|
||
|
|
grabCursor: true,
|
||
|
|
speed: 600,
|
||
|
|
pagination: {
|
||
|
|
el: ".swiper-pagination",
|
||
|
|
clickable: true,
|
||
|
|
},
|
||
|
|
navigation: {
|
||
|
|
nextEl: ".project-section .swiper-prev",
|
||
|
|
prevEl: ".project-section .swiper-next",
|
||
|
|
},
|
||
|
|
breakpoints: {
|
||
|
|
320: {
|
||
|
|
slidesPerView: 1,
|
||
|
|
slidesPerGroup: 1,
|
||
|
|
spaceBetween: 25,
|
||
|
|
},
|
||
|
|
767: {
|
||
|
|
slidesPerView: 2,
|
||
|
|
slidesPerGroup: 1,
|
||
|
|
spaceBetween: 30,
|
||
|
|
},
|
||
|
|
1024: {
|
||
|
|
slidesPerView: 3,
|
||
|
|
slidesPerGroup: 1,
|
||
|
|
},
|
||
|
|
},
|
||
|
|
});
|
||
|
|
|
||
|
|
// Testimonial Carousel
|
||
|
|
var swiperTesti = new Swiper(".testimonial-carousel", {
|
||
|
|
slidesPerView: 3,
|
||
|
|
spaceBetween: 25,
|
||
|
|
slidesPerGroup: 1,
|
||
|
|
loop: true,
|
||
|
|
autoplay: true,
|
||
|
|
grabCursor: true,
|
||
|
|
speed: 600,
|
||
|
|
pagination: {
|
||
|
|
el: ".swiper-pagination",
|
||
|
|
clickable: true,
|
||
|
|
},
|
||
|
|
breakpoints: {
|
||
|
|
320: {
|
||
|
|
slidesPerView: 1,
|
||
|
|
slidesPerGroup: 1,
|
||
|
|
spaceBetween: 25,
|
||
|
|
},
|
||
|
|
767: {
|
||
|
|
slidesPerView: 2,
|
||
|
|
slidesPerGroup: 1,
|
||
|
|
spaceBetween: 30,
|
||
|
|
},
|
||
|
|
1024: {
|
||
|
|
slidesPerView: 3,
|
||
|
|
slidesPerGroup: 1,
|
||
|
|
},
|
||
|
|
},
|
||
|
|
});
|
||
|
|
|
||
|
|
// Service Carousel
|
||
|
|
var swiperService = new Swiper(".service-carousel", {
|
||
|
|
slidesPerView: 2,
|
||
|
|
spaceBetween: 25,
|
||
|
|
slidesPerGroup: 1,
|
||
|
|
loop: true,
|
||
|
|
autoplay: false,
|
||
|
|
grabCursor: true,
|
||
|
|
speed: 600,
|
||
|
|
pagination: {
|
||
|
|
el: ".swiper-pagination",
|
||
|
|
clickable: true,
|
||
|
|
},
|
||
|
|
navigation: {
|
||
|
|
nextEl: ".service-section .swiper-prev",
|
||
|
|
prevEl: ".service-section .swiper-next",
|
||
|
|
},
|
||
|
|
breakpoints: {
|
||
|
|
320: {
|
||
|
|
slidesPerView: 1,
|
||
|
|
slidesPerGroup: 1,
|
||
|
|
spaceBetween: 25,
|
||
|
|
},
|
||
|
|
767: {
|
||
|
|
slidesPerView: 2,
|
||
|
|
slidesPerGroup: 1,
|
||
|
|
spaceBetween: 30,
|
||
|
|
},
|
||
|
|
1024: {
|
||
|
|
slidesPerView: 2,
|
||
|
|
slidesPerGroup: 1,
|
||
|
|
},
|
||
|
|
},
|
||
|
|
});
|
||
|
|
|
||
|
|
// Project Carousel
|
||
|
|
var swiperProject = new Swiper(".project-carousel-2", {
|
||
|
|
slidesPerView: 3,
|
||
|
|
spaceBetween: 25,
|
||
|
|
slidesPerGroup: 1,
|
||
|
|
loop: true,
|
||
|
|
autoplay: true,
|
||
|
|
grabCursor: true,
|
||
|
|
speed: 600,
|
||
|
|
pagination: {
|
||
|
|
el: ".swiper-pagination",
|
||
|
|
clickable: true,
|
||
|
|
},
|
||
|
|
navigation: {
|
||
|
|
nextEl: ".project-carousel-wrap .swiper-next",
|
||
|
|
prevEl: ".project-carousel-wrap .swiper-prev",
|
||
|
|
},
|
||
|
|
breakpoints: {
|
||
|
|
320: {
|
||
|
|
slidesPerView: 1,
|
||
|
|
slidesPerGroup: 1,
|
||
|
|
spaceBetween: 25,
|
||
|
|
},
|
||
|
|
767: {
|
||
|
|
slidesPerView: 2,
|
||
|
|
slidesPerGroup: 1,
|
||
|
|
spaceBetween: 30,
|
||
|
|
},
|
||
|
|
1024: {
|
||
|
|
slidesPerView: 3,
|
||
|
|
slidesPerGroup: 1,
|
||
|
|
},
|
||
|
|
},
|
||
|
|
});
|
||
|
|
|
||
|
|
// Testimonial Carousel
|
||
|
|
var swiperTesti = new Swiper(".testimonial-carousel-2", {
|
||
|
|
slidesPerView: 2,
|
||
|
|
spaceBetween: 25,
|
||
|
|
slidesPerGroup: 1,
|
||
|
|
loop: true,
|
||
|
|
autoplay: true,
|
||
|
|
grabCursor: true,
|
||
|
|
speed: 600,
|
||
|
|
pagination: {
|
||
|
|
el: ".swiper-pagination",
|
||
|
|
clickable: true,
|
||
|
|
},
|
||
|
|
navigation: {
|
||
|
|
nextEl: ".testimonial-carousel-2 .swiper-next",
|
||
|
|
prevEl: ".testimonial-carousel-2 .swiper-prev",
|
||
|
|
},
|
||
|
|
breakpoints: {
|
||
|
|
320: {
|
||
|
|
slidesPerView: 1,
|
||
|
|
slidesPerGroup: 1,
|
||
|
|
spaceBetween: 25,
|
||
|
|
},
|
||
|
|
767: {
|
||
|
|
slidesPerView: 2,
|
||
|
|
slidesPerGroup: 1,
|
||
|
|
spaceBetween: 30,
|
||
|
|
},
|
||
|
|
1024: {
|
||
|
|
slidesPerView: 2,
|
||
|
|
slidesPerGroup: 1,
|
||
|
|
},
|
||
|
|
},
|
||
|
|
});
|
||
|
|
|
||
|
|
// Scroll To Top
|
||
|
|
var scrollTop = $("#scrollup");
|
||
|
|
$(window).on('scroll', function() {
|
||
|
|
var topPos = $(this).scrollTop();
|
||
|
|
if (topPos > 100) {
|
||
|
|
$('#scrollup').removeClass('hide');
|
||
|
|
$('#scrollup').addClass('show');
|
||
|
|
|
||
|
|
} else {
|
||
|
|
$('#scrollup').removeClass('show');
|
||
|
|
$('#scrollup').addClass('hide');
|
||
|
|
}
|
||
|
|
});
|
||
|
|
|
||
|
|
$(scrollTop).on("click", function() {
|
||
|
|
$('html, body').animate({
|
||
|
|
scrollTop: 0
|
||
|
|
},0);
|
||
|
|
return false;
|
||
|
|
});
|
||
|
|
|
||
|
|
});
|
||
|
|
|
||
|
|
})(jQuery);
|