CSS Как я могу отключить прокрутку во время анимации?

Question

Как отключить прокрутку во время анимации в CSS? Но я не хочу давать overflow:hidden на тело.

Answer 1

Невозможно установить определенное правило CSS после завершения анимации с помощью чистого CSS.

Если возможно, вы можете использовать JavaScript, чтобы отложить возврат к нормальному прокручиванию после того, как, например, 5 секунд. Ниже приведен пример с jQuery.

CSS (добавить правило переполнения тела):

body{ 
    overflow: hidden; 
} 

JavaScript:

$(document).ready(function() { 
    window.setTimeout(changeOverflow, 5000); // set overflow back to auto after 5s 
}); 

function changeOverflow() { 
    $('body').css("overflow", "auto"); 
} 

См forked CodePen.