Question

我做了一个粘性菜单，我可以让它工作，基本上这是逻辑

//get menu from html
var menu = $('#menu-sticky');

//hide it
menu.hide();

//get offset top
var altura = $("#videoAltura").offset().top;

//show and hide it
$(window).on('scroll', function(){

    if($(window).scrollTop() > altura){
        menu.show();

    }else{
        menu.hide();
    }

});

它运作得很完美，但我想让它在显示和隐藏时有动画，我想要这种动画：https://www.tesla.com/es_MX/roadster

你能帮帮我吗？

Answer 1

基于检查图像元素，这里是图像处于活动状态时的css。

[id='wrapper'] .scroll-reveal.active {
        opacity: 1;
        transition: transform 1.5s cubic-bezier(0.165,0.84,0.44,1),opacity 1.5s cubic-bezier(0.165,0.84,0.44,1);
        transform: translate3d(0px, 0px, 0px);
    }

设置粘性菜单JQUERY的动画

1 个答案: