Как я могу перестать отображать css анимации при загрузке связанных страниц с тем же верхним / нижним колонтитулом? - PullRequest
0 голосов
/ 18 февраля 2020

У меня есть несколько простых css анимаций при загрузке целевой страницы сайта. Я хочу переместить свою навигационную панель и нижний колонтитул в частичное и разместить ссылку на него на каждой странице, но я не хочу, чтобы эти анимации воспроизводились на любой странице, кроме целевой страницы.

Это мой первый раз, когда я возился с css анимаций, поэтому мне интересно, есть ли способ включить верхний и нижний колонтитулы в частичное на всех связанных страницах без запуска анимации.

Я мог бы переделать верхний и нижний колонтитулы частично с отдельными именами классов, чтобы они не соответствовали одному и тому же css, но это добавило бы много беспорядка, которого я хотел бы избежать.

1 Ответ

0 голосов
/ 18 февраля 2020

У вас есть два варианта

  1. Создайте отдельный CSS для анимации и не загружайте его ни на какую другую страницу, кроме вашей целевой страницы.

  2. Если ваши классы анимации смешаны с другими CSS или вы просто хотите сохранить их вместе с вашим основным CSS, просто создайте эксклюзивный класс для вашего тела целевой страницы, такой как «посадка с анимацией», как этот

<body class="landing-with-animations">

и затем поместите анимацию в этот класс в CSS как

.landing-with-animations .animation1 {
/*rules here*/
}

.landing-with-animations .animation2{
/*rules here*/
}

таким образом, ваша анимация работает только когда они находятся внутри вашей целевой страницы в ее теле с классом "посадка с анимацией"

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...