Custom Divi Menu with Slide Effect

Building A Custom Divi menu isn’t as difficult as it used to be. We can still take it another level with a little bit of code and imagination.

In this video, we show you how we built a custom Divi menu using brand new position features and a little jQuery. 

Get the full layout for free at the end of this post…

Copy the code below into Divi -> Theme Builder -> Global Header

Insert a Code Module -> Copy the code below into the code module

< script >
 jQuery(document).ready(function($) { // <-- Ensures jQuery runs after the document has loaded.

  $(window).scroll(function() {
   var scroll = $(window).scrollTop(); // <-- This is how you use variables in jQuery! Easy, right?!
   if (scroll >= 500) { // If user is scrolled down 500px from the top...
    $("#klm_header").slideUp(200);
   } else {
    // Undo something like...
    $("#klm_header").slideDown(200)
   }
  });
 }); 
</script>

Related Posts

Build A Fixed Divi Menu

Build A Fixed Divi Menu

We discuss how to custom code a unique menu using the Divi Wordpress Theme. Follow along and you will have a unique menu in minutes.

Join the conversation

0 Comments

Submit a Comment

Your email address will not be published. Required fields are marked *