JavaScript Codes

Javascript Codes

Use this for Add Class on menu links using Javascript

   
   (function(){
      var el = document.querySelectorAll('.custom-menu-primary a')
      el.forEach(function(e){
      e.classList = e.textContent.toLowerCase().replace(/[^a-zA-Z0-9\.-]+/g,"");
      })
   })();
   
   

Add Class on Scroll using Varible Height

   
   (function() {
       let _body = document.getElementsByTagName('body');
       window.addEventListener('scroll', function() {
           _top = window.scrollY;
           if (_top > 100) {
               _body[0].classList.add("fadIn");
           } else {
               _body[0].classList.remove("fadIn")
           }
       });
   })();
   
   

Add Class on Scroll using Varible Height

   
   (function() {
       let _body = document.getElementsByTagName('body');
       let herderHeight = document.querySelector('.header-container-wrapper').scrollTop;
       window.addEventListener('scroll', function() {
           _top = window.scrollY;
           if (_top > herderHeight) {
               _body[0].classList.add("fadIn");
           } else {
               _body[0].classList.remove("fadIn")
           }
       });
   })();
   
   

Back To Top

   
   function scrollToTop(scrollDuration) {
    var scrollStep = -window.scrollY / (scrollDuration / 15);
    var scrollInterval = setInterval(function() {
        if (window.scrollY != 0) {
            window.scrollBy(0, scrollStep);
        } else {
            clearInterval(scrollInterval);
        }
    }, 15);
};

document.querySelector(".custom-back-to-top a").addEventListener("click", function(e) {
    e.preventDefault();
    scrollToTop(500);
});
   
   

Child Trigger

   
var childTirgger = document.querySelectorAll('.child-trigger')

childTirgger.forEach( function(ele){

 ele.addEventListener('click', function(e){

  var _style = window.getComputedStyle(ele.nextElementSibling, null).display;
  console.log(_style)

  if ( _style == 'none' ) {

   var sliblings = ele.parentNode.parentNode.children;
   for( var i =0; i < sliblings.length; i++ ){
    if (sliblings[i].classList.contains('has-submenu') ){
     sliblings[i].children[1].classList.remove('open-child');
     sliblings[i].children[2].style.display = 'none'
    }
   }

   ele.classList.add('open-child');
   ele.nextElementSibling.style.display = 'block'
  } else {

   ele.classList.remove('open-child');
   ele.nextElementSibling.style.display = 'none'
  }
 })

})