TanchoToplineCargo/public/target/js/custom.js

185 lines
4.0 KiB
JavaScript
Raw Normal View History

2024-05-05 04:47:49 +00:00
$(".js-select2-dela").select2({
placeholder: "Select Tags",
width: 'resolve',
theme: "classic"
});
document.addEventListener("DOMContentLoaded", function () {
window.addEventListener('scroll', function () {
if (window.scrollY > 20) {
document.getElementById('navbar_top').classList.add('fixed-top');
// add padding top to show content behind navbar
navbar_height = document.querySelector('.navbar').offsetHeight;
document.body.style.paddingTop = navbar_height + 'px';
} else {
document.getElementById('navbar_top').classList.remove('fixed-top');
// remove padding top from body
document.body.style.paddingTop = '0';
}
});
});
function checkScroll() {
var startY = $('.navbar').height() * 0.5; //The point where the navbar changes in px
if ($(window).scrollTop() > startY) {
$('.navbar').addClass("scrolled");
} else {
$('.navbar').removeClass("scrolled");
}
}
if ($('.navbar').length > 0) {
$(window).on("scroll load resize", function () {
checkScroll();
});
}
// When the user scrolls down 80px from the top of the document, resize the navbar's padding and the logo's font size
window.onscroll = function () { scrollFunction() };
function scrollFunction() {
if (document.body.scrollTop > 10 || document.documentElement.scrollTop > 40) {
document.getElementById("navbar_top").style.padding = "30px 10px";
} else {
document.getElementById("navbar_top").style.padding = "20px 10px";
}
if (document.body.scrollTop > 40 || document.documentElement.scrollTop > 40) {
document.getElementById("navbar_top").style.boxShadow = "rgba(0, 0, 0, 0) 0px 10px 20px, rgba(0, 0, 0, 0.02196) 0px 6px 6px";
} else {
document.getElementById("navbar_top").style.boxShadow = "rgba(0, 0, 0, 0) 0px 10px 20px, rgba(0, 0, 0, 0.03156) 0px 6px 6px";
}
}
/** Owl Carousel */
/** Owl Carousel */
$('#clients').owlCarousel({
loop: true,
margin: 10,
nav: false,
dots: false,
autoplay: true,
autoplayTimeout: 4000,
autoplayHoverPause: false,
margin: 10,
loop: true,
responsive: {
0: {
items: 0
},
400: {
items: 2
},
600: {
items: 3
},
1000: {
items: 5
}
}
})
$('#category').owlCarousel({
loop: true,
margin: 10,
nav: false,
dots: false,
autoplay: true,
autoplayTimeout: 4000,
autoplayHoverPause: false,
margin: 30,
loop: true,
responsive: {
0: {
items: 0
},
400: {
items: 1
},
600: {
items: 1
},
1000: {
items: 3
}
}
})
$('.owl-carousel').owlCarousel({
loop: true,
margin: 10,
nav: false,
dots: false,
autoplay: true,
autoplayTimeout: 4000,
autoplayHoverPause: false,
margin: 30,
loop: true,
responsive: {
0: {
items: 0
},
400: {
items: 1
},
600: {
items: 1
},
1000: {
items: 3
}
}
})
var owl = $('#category');
owl.owlCarousel();
// Go to the next item
$('.customNextBtn').click(function () {
owl.trigger('next.owl.carousel');
})
// Go to the previous item
$('.customPrevBtn').click(function () {
// With optional speed parameter
// Parameters has to be in square bracket '[]'
owl.trigger('prev.owl.carousel', [300]);
})
// make it as accordion for smaller screens
if (window.innerWidth > 992) {
document.querySelectorAll('.navbar .nav-item').forEach(function (everyitem) {
everyitem.addEventListener('mouseover', function (e) {
let el_link = this.querySelector('a[data-bs-toggle]');
if (el_link != null) {
let nextEl = el_link.nextElementSibling;
el_link.classList.add('show');
nextEl.classList.add('show');
}
});
everyitem.addEventListener('mouseleave', function (e) {
let el_link = this.querySelector('a[data-bs-toggle]');
if (el_link != null) {
let nextEl = el_link.nextElementSibling;
el_link.classList.remove('show');
nextEl.classList.remove('show');
}
})
});
}
// end if innerWidth
// DOMContentLoaded end