window.onload = function () {
Particles.init({
selector: ".background"
});
if($(window).scrollTop() > 20){
nav.classList.add("sticky");
scrollBtn.style.display = "block";
}else{
nav.classList.remove("sticky");
scrollBtn.style.display = "none";
}
};
var particles = Particles.init({
selector: ".background",
color: ["#faebd7", "white", "burlywood"],
connectParticles: false,
responsive: [
{
breakpoint: 768,
options: {
color: ["#faebd7", "white", "burlywood"],
maxParticles: 43,
connectParticles: false
}
}
]
});
$(window).scroll(function(e){
parallax();
});
function parallax(){
var scrolled = $(window).scrollTop();
$('.home').css('top',-(scrolled*0.0315)+'rem');
$('.home > .home-content').css('padding-top',(scrolled*0.05)+'rem');
$('.home > .home-content').css('opacity',1-(scrolled*.00175));
};
// Sticky Navigation Menu Js
let nav = document.querySelector("nav");
let scrollBtn = document.querySelector(".scroll-button a");
let val;
window.onscroll = function() {
if($(window).scrollTop() > 20){
nav.classList.add("sticky");
scrollBtn.style.display = "block";
}else{
nav.classList.remove("sticky");
scrollBtn.style.display = "none";
}
}
// Side Navigation Menu Js
let body = document.querySelector("body");
let navBar = document.querySelector(".navbar");
let menuBtn = document.querySelector(".menu-btn");
let cancelBtn = document.querySelector(".cancel-btn");
menuBtn.onclick = function() {
navBar.classList.add("active");
menuBtn.style.opacity = "0";
menuBtn.style.pointerEvents = "none";
// body.style.overflowX = "hidden";
// scrollBtn.style.pointerEvents = "none";
}
cancelBtn.onclick = function() {
navBar.classList.remove("active");
menuBtn.style.opacity = "1";
menuBtn.style.pointerEvents = "auto";
// body.style.overflowX = "auto";
// scrollBtn.style.pointerEvents = "auto";
}
// Side Navigation Bar Close While We click On Navigation Links
// let navLinks = document.querySelectorAll(".menu li a");
// for (var i = 0; i < navLinks.length; i++) {
// navLinks[i].addEventListener("click" , function() {
// navBar.classList.remove("active");
// // menuBtn.style.opacity = "1";
// // menuBtn.style.pointerEvents = "auto";
// });
// }
// Image Lazy Loading
window.addEventListener("DOMContentLoaded", function() {
var lazy = document.getElementsByClassName('lazy');
initializeLoad(lazy);
});
function initializeLoad(imgs) {
if (imgs.length > 0) {
if ('IntersectionObserver' in window) {
lazyLoad(imgs);
} else {
loadIntersection(imgs);
}
} else {
return;
}
}
function lazyLoad(lazy) {
var options = {
threshold: 0.8
}
var observer = new IntersectionObserver(function(entries, self) {
for (var i = 0; i < entries.length; i++) {
var entry = entries[i];
if (entry.isIntersecting) {
var src = entry.target.getAttribute('data-src');
TweenMax.set(entry.target, {attr:{src:src}});
TweenMax.fromTo(entry.target, 1, {css:{opacity:0, y:"-50px"}}, {css:{opacity:1, y:0}}, 1.5);
self.unobserve(entry.target);
}
}
}, options)
for (var i = 0; i < lazy.length; i++) {
var lazyItem = lazy[i];
observer.observe(lazyItem);
}
}
function loadIntersection(lazy) {
var io = document.createElement('script');
io.src = "https://polyfill.io/v3/polyfill.min.js?features=IntersectionObserver";
document.head.appendChild(io);
return io.onload = function() {
lazyLoad(lazy);
}
}