Spaces:
Running
Running
| // ------------------------------------------------ | |
| // Project Name: Ignite - Coming Soon and Landing Page Template | |
| // Project Description: Ignite - functional and beautifully designed coming soon and landing page template to kick-start your project | |
| // Tags: mix_design, coming soon, under construction, template, landing page, portfolio, one page, responsive, html5, css3, creative, clean, agency, personal page | |
| // Version: 1.0.1 | |
| // Build Date: May 2023 | |
| // Last Update: January 2024 | |
| // This product is available exclusively on Themeforest | |
| // Author: mix_design | |
| // Author URI: https://themeforest.net/user/mix_design | |
| // File name: custom.js | |
| // ------------------------------------------------ | |
| // ------------------------------------------------ | |
| // Table of Contents | |
| // ------------------------------------------------ | |
| // | |
| // 1. Loader & Loading Animation | |
| // 2. Typed.js Plugin Settings | |
| // 3. Swiper Slider | |
| // 4. Typed.js Plugin Settings | |
| // 5. Magnific Popup Video | |
| // 6. KBW-Countdown | |
| // 7. Vegas Kenburns | |
| // 8. Skillbars | |
| // 9. Mailchimp Notify Form | |
| // 10. Say Hello Form | |
| // 11. ParticlesJS Background | |
| // | |
| // ------------------------------------------------ | |
| // Table of Contents End | |
| // ------------------------------------------------ | |
| $(window).on("load", function() { | |
| "use strict"; | |
| // --------------------------------------------- // | |
| // Loader & Loading Animation Start | |
| // --------------------------------------------- // | |
| $(".loader__logo").addClass('scaleOut'); | |
| setTimeout(function() { | |
| $(".loader").addClass('loaded'); | |
| $("#main").addClass('active animate-in'); | |
| $('#home-trigger').addClass('active-link'); | |
| }, 300); | |
| setTimeout(function() { | |
| $("body").addClass('loaded'); | |
| }, 1400); | |
| // --------------------------------------------- // | |
| // Loader & Loading Animation End | |
| // --------------------------------------------- // | |
| // --------------------------------------------- // | |
| // Typed.js Plugin Settings Start | |
| // --------------------------------------------- // | |
| var animatedHeadline = $(".animated-headline"); | |
| if (animatedHeadline.length) { | |
| var typed = new Typed('#typed', { | |
| stringsElement: '#typed-strings', | |
| loop: true, | |
| typeSpeed: 60, | |
| backSpeed: 30, | |
| backDelay: 2500 | |
| }); | |
| } | |
| // --------------------------------------------- // | |
| // Typed.js Plugin Settings End | |
| // --------------------------------------------- // | |
| }); | |
| $(function() { | |
| "use strict"; | |
| // --------------------------------------------- // | |
| // Swiper Slider Start | |
| // --------------------------------------------- // | |
| var swiper = new Swiper('.swiper', { | |
| // Optional parameters | |
| grabCursor: true, | |
| effect: "creative", | |
| creativeEffect: { | |
| prev: { | |
| //shadow: true, | |
| translate: ["-20%", 0, -1], | |
| }, | |
| next: { | |
| translate: ["100%", 0, 0], | |
| }, | |
| }, | |
| parallax: true, | |
| speed: 1300, | |
| loop: true, | |
| autoplay: { | |
| delay: 3000, | |
| disableOnInteraction: false, | |
| }, | |
| // If we need pagination | |
| pagination: { | |
| el: '.swiper-pagination', | |
| clickable: true, | |
| }, | |
| // Navigation arrows | |
| navigation: { | |
| nextEl: '.swiper-button-next', | |
| prevEl: '.swiper-button-prev', | |
| }, | |
| }); | |
| // --------------------------------------------- // | |
| // Swiper Slider End | |
| // --------------------------------------------- // | |
| // --------------------------------------------- // | |
| // Magnific Popup Video Start | |
| // --------------------------------------------- // | |
| $('#showreel-trigger').magnificPopup({ | |
| type: 'iframe', | |
| mainClass: 'mfp-fade', | |
| removalDelay: 160, | |
| preloader: false, | |
| fixedContentPos: false, | |
| callbacks: { | |
| beforeOpen: function() { | |
| $('body').addClass('overflow-hidden'); | |
| }, | |
| close: function() { | |
| $('body').removeClass('overflow-hidden'); | |
| } | |
| } | |
| }); | |
| // --------------------------------------------- // | |
| // Magnific Popup Video End | |
| // --------------------------------------------- // | |
| // --------------------------------------------- // | |
| // KBW-Countdown Start | |
| // --------------------------------------------- // | |
| $('#countdown').countdown({ | |
| until: $.countdown.UTCDate(+10, 2024, 5, 14), | |
| format: 'D' | |
| }); | |
| // --------------------------------------------- // | |
| // KBW-Countdown End | |
| // --------------------------------------------- // | |
| // --------------------------------------------- // | |
| // Vegas Kenburns Start | |
| // --------------------------------------------- // | |
| var bgndKenburns = $('#bgndKenburns'); | |
| if (bgndKenburns.length) { | |
| bgndKenburns.vegas({ | |
| timer: false, | |
| delay: 8000, | |
| transition: 'fade2', | |
| transitionDuration: 2000, | |
| slides: [{ | |
| src: "img/backgrounds/960x1080-kenburns-1.webp" | |
| }, | |
| { | |
| src: "img/backgrounds/960x1080-kenburns-2.webp" | |
| }, | |
| { | |
| src: "img/backgrounds/960x1080-kenburns-3.webp" | |
| } | |
| ], | |
| animation: ['kenburnsUp', 'kenburnsDown', 'kenburnsLeft', 'kenburnsRight'] | |
| }); | |
| } | |
| var bgndKenburnsFull = $('#bgndKenburnsFull'); | |
| if (bgndKenburnsFull.length) { | |
| bgndKenburnsFull.vegas({ | |
| timer: false, | |
| delay: 8000, | |
| transition: 'fade2', | |
| transitionDuration: 2000, | |
| slides: [{ | |
| src: "img/backgrounds/1920x1080-kenburns-1.webp" | |
| }, | |
| { | |
| src: "img/backgrounds/1920x1080-kenburns-2.webp" | |
| }, | |
| { | |
| src: "img/backgrounds/1920x1080-kenburns-3.webp" | |
| } | |
| ], | |
| animation: ['kenburnsUp', 'kenburnsDown', 'kenburnsLeft', 'kenburnsRight'] | |
| }); | |
| } | |
| // --------------------------------------------- // | |
| // Vegas Kenburns End | |
| // --------------------------------------------- // | |
| // --------------------------------------------- // | |
| // Skillbars Settings Start | |
| // --------------------------------------------- // | |
| $('.skillbar').skillBars({ | |
| from: 0, | |
| speed: 4000, | |
| interval: 100, | |
| }); | |
| // --------------------------------------------- // | |
| // Skillbars Settings End | |
| // --------------------------------------------- // | |
| // --------------------------------------------- // | |
| // Mailchimp Notify Form Start | |
| // --------------------------------------------- // | |
| $('.notify-form').ajaxChimp({ | |
| callback: mailchimpCallback, | |
| url: 'https://besaba.us10.list-manage.com/subscribe/post?u=e8d650c0df90e716c22ae4778&id=54a7906900' | |
| }); | |
| function mailchimpCallback(resp) { | |
| if (resp.result === 'success') { | |
| $('.notify').find('.form').addClass('is-hidden'); | |
| $('.notify').find('.subscription-ok').addClass('is-visible'); | |
| setTimeout(function() { | |
| // Done Functions | |
| $('.notify').find('.subscription-ok').removeClass('is-visible'); | |
| $('.notify').find('.form').delay(300).removeClass('is-hidden'); | |
| $('.notify-form').trigger("reset"); | |
| }, 5000); | |
| } else if (resp.result === 'error') { | |
| $('.notify').find('.form').addClass('is-hidden'); | |
| $('.notify').find('.subscription-error').addClass('is-visible'); | |
| setTimeout(function() { | |
| // Done Functions | |
| $('.notify').find('.subscription-error').removeClass('is-visible'); | |
| $('.notify').find('.form').delay(300).removeClass('is-hidden'); | |
| $('.notify-form').trigger("reset"); | |
| }, 5000); | |
| } | |
| }; | |
| // --------------------------------------------- // | |
| // Mailchimp Notify Form End | |
| // --------------------------------------------- // | |
| // --------------------------------------------- // | |
| // Say Hello Form Start | |
| // --------------------------------------------- // | |
| $("#sayhello-form").submit(function() { //Change | |
| var th = $(this); | |
| $.ajax({ | |
| type: "POST", | |
| url: "mail.php", //Change | |
| data: th.serialize() | |
| }).done(function() { | |
| $('.sayhello').find('.form').addClass('is-hidden'); | |
| $('.sayhello').find('.reply-group').addClass('is-visible'); | |
| setTimeout(function() { | |
| // Done Functions | |
| $('.sayhello').find('.reply-group').removeClass('is-visible'); | |
| $('.sayhello').find('.form').delay(300).removeClass('is-hidden'); | |
| th.trigger("reset"); | |
| }, 5000); | |
| }); | |
| return false; | |
| }); | |
| // --------------------------------------------- // | |
| // Say Hello Form End | |
| // --------------------------------------------- // | |
| // --------------------------------------------- // | |
| // ParticlesJS Background Start | |
| // --------------------------------------------- // | |
| // Triangles BG - particlesJS | |
| var bgndTriangles = $('#triangles-js'); | |
| if (bgndTriangles.length) { | |
| particlesJS('triangles-js', { | |
| "particles": { | |
| "number": { | |
| "value": 33, | |
| "density": { | |
| "enable": true, | |
| "value_area": 1420.4657549380909 | |
| } | |
| }, | |
| "color": { | |
| "value": "#ffffff" | |
| }, | |
| "shape": { | |
| "type": "triangle", | |
| "stroke": { | |
| "width": 0, | |
| "color": "#000000" | |
| }, | |
| "polygon": { | |
| "nb_sides": 5 | |
| }, | |
| "image": { | |
| "src": "img/github.svg", | |
| "width": 100, | |
| "height": 100 | |
| } | |
| }, | |
| "opacity": { | |
| "value": 0.06313181133058181, | |
| "random": false, | |
| "anim": { | |
| "enable": false, | |
| "speed": 1, | |
| "opacity_min": 0.1, | |
| "sync": false | |
| } | |
| }, | |
| "size": { | |
| "value": 11.83721462448409, | |
| "random": true, | |
| "anim": { | |
| "enable": false, | |
| "speed": 40, | |
| "size_min": 0.1, | |
| "sync": false | |
| } | |
| }, | |
| "line_linked": { | |
| "enable": true, | |
| "distance": 150, | |
| "color": "#ffffff", | |
| "opacity": 0.4, | |
| "width": 1 | |
| }, | |
| "move": { | |
| "enable": true, | |
| "speed": 4, | |
| "direction": "none", | |
| "random": false, | |
| "straight": false, | |
| "out_mode": "out", | |
| "bounce": false, | |
| "attract": { | |
| "enable": false, | |
| "rotateX": 600, | |
| "rotateY": 1200 | |
| } | |
| } | |
| }, | |
| "interactivity": { | |
| "detect_on": "canvas", | |
| "events": { | |
| "onhover": { | |
| "enable": true, | |
| "mode": "repulse" | |
| }, | |
| "onclick": { | |
| "enable": true, | |
| "mode": "push" | |
| }, | |
| "resize": true | |
| }, | |
| "modes": { | |
| "grab": { | |
| "distance": 400, | |
| "line_linked": { | |
| "opacity": 1 | |
| } | |
| }, | |
| "bubble": { | |
| "distance": 400, | |
| "size": 40, | |
| "duration": 2, | |
| "opacity": 8, | |
| "speed": 3 | |
| }, | |
| "repulse": { | |
| "distance": 200, | |
| "duration": 0.4 | |
| }, | |
| "push": { | |
| "particles_nb": 4 | |
| }, | |
| "remove": { | |
| "particles_nb": 2 | |
| } | |
| } | |
| }, | |
| "retina_detect": true | |
| }); | |
| }; | |
| // --------------------------------------------- // | |
| // ParticlesJS Background End | |
| // --------------------------------------------- // | |
| }); |