mirror of
https://github.com/rjNemo/vf-site
synced 2026-06-06 09:16:39 +00:00
208 lines
No EOL
5.3 KiB
JavaScript
208 lines
No EOL
5.3 KiB
JavaScript
/* Description: Custom JS file */
|
|
|
|
|
|
(function($) {
|
|
"use strict";
|
|
|
|
/* Navbar Scripts */
|
|
// jQuery for page scrolling feature - requires jQuery Easing plugin
|
|
$(function() {
|
|
$(document).on('click', 'a.page-scroll', function(event) {
|
|
var $anchor = $(this);
|
|
$('html, body').stop().animate({
|
|
scrollTop: $($anchor.attr('href')).offset().top
|
|
}, 600, 'easeInOutExpo');
|
|
event.preventDefault();
|
|
});
|
|
});
|
|
|
|
// offcanvas script from Bootstrap + added element to close menu on click in small viewport
|
|
$('[data-toggle="offcanvas"], .navbar-nav li a:not(.dropdown-toggle').on('click', function () {
|
|
$('.offcanvas-collapse').toggleClass('open')
|
|
})
|
|
|
|
// hover in desktop mode
|
|
function toggleDropdown (e) {
|
|
const _d = $(e.target).closest('.dropdown'),
|
|
_m = $('.dropdown-menu', _d);
|
|
setTimeout(function(){
|
|
const shouldOpen = e.type !== 'click' && _d.is(':hover');
|
|
_m.toggleClass('show', shouldOpen);
|
|
_d.toggleClass('show', shouldOpen);
|
|
$('[data-toggle="dropdown"]', _d).attr('aria-expanded', shouldOpen);
|
|
}, e.type === 'mouseleave' ? 300 : 0);
|
|
}
|
|
$('body')
|
|
.on('mouseenter mouseleave','.dropdown',toggleDropdown)
|
|
.on('click', '.dropdown-menu a', toggleDropdown);
|
|
|
|
|
|
/* Header Slider - Swiper */
|
|
var headerSlider = new Swiper('.header-slider', {
|
|
autoplay: {
|
|
delay: 3500,
|
|
disableOnInteraction: false
|
|
},
|
|
loop: true,
|
|
effect: "fade",
|
|
speed: 700
|
|
});
|
|
|
|
|
|
/* Image Slider - Swiper */
|
|
var imageSlider = new Swiper('.image-slider', {
|
|
autoplay: {
|
|
delay: 3000,
|
|
disableOnInteraction: false
|
|
},
|
|
loop: false,
|
|
navigation: {
|
|
nextEl: '.swiper-button-next',
|
|
prevEl: '.swiper-button-prev'
|
|
},
|
|
slidesPerView: 3,
|
|
spaceBetween: 20,
|
|
breakpoints: {
|
|
// when window is <= 767px
|
|
767: {
|
|
slidesPerView: 1
|
|
},
|
|
// when window is <= 991px
|
|
991: {
|
|
slidesPerView: 2,
|
|
spaceBetween: 10
|
|
},
|
|
// when window is <= 1199px
|
|
1199: {
|
|
slidesPerView: 3,
|
|
spaceBetween: 20
|
|
},
|
|
}
|
|
});
|
|
|
|
|
|
/* Image Slider Room - Swiper */
|
|
var imageSlider = new Swiper('.image-slider-room', {
|
|
autoplay: {
|
|
delay: 3000,
|
|
disableOnInteraction: false
|
|
},
|
|
loop: false,
|
|
navigation: {
|
|
nextEl: '.swiper-button-next',
|
|
prevEl: '.swiper-button-prev',
|
|
}
|
|
});
|
|
|
|
|
|
/* Card Slider - Swiper */
|
|
var cardSlider = new Swiper('.card-slider', {
|
|
autoplay: {
|
|
delay: 4000,
|
|
disableOnInteraction: false
|
|
},
|
|
loop: true,
|
|
navigation: {
|
|
nextEl: '.swiper-button-next',
|
|
prevEl: '.swiper-button-prev'
|
|
},
|
|
slidesPerView: 3,
|
|
spaceBetween: 30,
|
|
breakpoints: {
|
|
// when window is <= 767px
|
|
767: {
|
|
slidesPerView: 1
|
|
},
|
|
// when window is <= 991px
|
|
991: {
|
|
slidesPerView: 2
|
|
}
|
|
}
|
|
});
|
|
|
|
|
|
/* Image Lightbox - Magnific Popup */
|
|
$('.popup-link').magnificPopup({
|
|
removalDelay: 300,
|
|
type: 'image',
|
|
callbacks: {
|
|
beforeOpen: function() {
|
|
this.st.image.markup = this.st.image.markup.replace('mfp-figure', 'mfp-figure ' + this.st.el.attr('data-effect'));
|
|
},
|
|
beforeClose: function() {
|
|
$('.mfp-figure').addClass('fadeOut');
|
|
}
|
|
},
|
|
gallery:{
|
|
enabled:true //enable gallery mode
|
|
}
|
|
});
|
|
|
|
|
|
/* Details Lightbox - Magnific Popup */
|
|
$('.popup-with-move-anim').magnificPopup({
|
|
type: 'inline',
|
|
fixedContentPos: true,
|
|
fixedBgPos: true,
|
|
overflowY: 'auto',
|
|
closeBtnInside: true,
|
|
preloader: false,
|
|
midClick: true,
|
|
removalDelay: 300,
|
|
mainClass: 'my-mfp-slide-bottom'
|
|
});
|
|
|
|
|
|
/* Move Form Fields Label When User Types */
|
|
// for input and textarea fields
|
|
$("input, textarea").keyup(function(){
|
|
if ($(this).val() != '') {
|
|
$(this).addClass('notEmpty');
|
|
} else {
|
|
$(this).removeClass('notEmpty');
|
|
}
|
|
});
|
|
|
|
|
|
/* Datepicker - Bootstrap Datepicker */
|
|
$('#start').datepicker({
|
|
todayHighlight: true,
|
|
autoclose: true,
|
|
format: 'MM/dd/yyyy',
|
|
});
|
|
|
|
// detects change to selected date to keep the label above the value in the input field
|
|
$('#start').datepicker().on('changeDate', function(e) {
|
|
$("input[id=start]").addClass('notEmpty');
|
|
});
|
|
|
|
$('#end').datepicker({
|
|
autoclose: true,
|
|
format: 'MM/dd/yyyy'
|
|
});
|
|
|
|
// detects change to selected date to keep the label above the value in the input field// keeps the label above the value in the input field
|
|
$('#end').datepicker().on('changeDate', function(e) {
|
|
$("input[id=end]").addClass('notEmpty');
|
|
});
|
|
|
|
|
|
/* Back To Top Button */
|
|
// create the back to top button
|
|
$('body').prepend('<a href="body" class="back-to-top page-scroll">Back to Top</a>');
|
|
var amountScrolled = 700;
|
|
$(window).scroll(function() {
|
|
if ($(window).scrollTop() > amountScrolled) {
|
|
$('a.back-to-top').fadeIn('500');
|
|
} else {
|
|
$('a.back-to-top').fadeOut('500');
|
|
}
|
|
});
|
|
|
|
|
|
/* Removes Long Focus On Buttons */
|
|
$(".button, a, button").mouseup(function() {
|
|
$(this).blur();
|
|
});
|
|
|
|
})(jQuery); |