Scrollbar appears through CSS animation/transition

Question

I am animating my ng-view in Angular with a cubic-bezier transition:

/* Animations */
.slide-animation.ng-enter, .slide-animation.ng-leave           


        

Answer 1

I faced the same problem. This is how I solved it (I'm using my own code as an example)

HTML

    
John Doe
    
Programmer
    
Lorem ipsum dolor sit amet consectetum...

CSS

.team-box-2-desc {
    max-height: 0;
    overflow-y: hidden;
    transition: max-height 0.5s ease-out;
}
.team-box-2:hover .team-box-2-desc{
    max-height: 350px;
    transition: max-height 1s ease-in;
}

JS

$('.team-box-2').hover(function(){
    var element = $(this);
    setTimeout(function(){
        element.find('p.team-box-2-desc').css('overflow-y', 'auto');
    }, 1000);
}, function(){
    $(this).find('p.team-box-2-desc').css('overflow-y', 'hidden');
});