Smooth transition from a Sticky menu

Asked

Viewed 80 times

1

Created a Sticky menu, works perfectly, but the transition is not smooth, as I do to add?

function stick() {
if ($(this).scrollTop() > 140){  
    $('.header').addClass("sticky");
    $('.logo').addClass("sticky");
    $('.header-menu').addClass("sticky");
    $('.dropdown-content').addClass("sticky");
    $('#mobile-clicker').addClass("sticky");
    $('.hamburguer-img').addClass("sticky");
    $('.active').addClass("sticky");
    $('.active-drop').addClass("sticky");
    $('#searchform').addClass("sticky");
    $('.search-formulario').addClass("sticky");
} else {
    $('.header').removeClass("sticky");
    $('.logo').removeClass("sticky");
    $('.header-menu').removeClass("sticky");
    $('.dropdown-content').removeClass("sticky");
    $('#mobile-clicker').removeClass("sticky");
    $('.hamburguer-img').removeClass("sticky");
    $('.active').removeClass("sticky");
    $('.active-drop').removeClass("sticky");
    $('#searchform').removeClass("sticky");
    $('.search-formulario').removeClass("sticky");
}

}

  • Try using CSS animations/transitions instead of javascript/jquery.

  • Whoa... what a mess it is. It’s a little complicated to say exactly what is causing this problem without seeing an example. Add an example or try to recreate it in one jsFiddle and try to detail better what the transition problem is.

No answers

Browser other questions tagged

You are not signed in. Login or sign up in order to post.