1

Is there a way to modify my code so that I can simply have my navigation menu slide from left to right instead from top to bottom and back up? If not, what would be a clean way to write the jquery code to have the menu slide in from left to right and back?

jQuery:

   $(".nav-dropdown-btn").on("click", function() {
    if ($(".nav-menu").css("display") == "none" ) {
        $(".nav-menu").slideDown();
    } else {
        $(".nav-menu").slideUp();
    }
});
sk_225
  • 417
  • 1
  • 7
  • 16

1 Answers1

2

There's no generic slide left or right animation, so you sort of have to create it yourself. Slide right to left?

You also might want to set white-space:nowrap; for each of the li elements though so you don't get a weird animation where it expands as the width shrinks.

$(".nav-dropdown-btn").on("click", function() {
    $(".nav-menu").animate({width:'toggle'}, 1050);
});

Demo

Community
  • 1
  • 1
Sir Neuman
  • 1,385
  • 1
  • 14
  • 23