Как я могу удалить заставку при выходе? - PullRequest
0 голосов
/ 14 октября 2018

Я делаю страницу входа и выхода с заставкой, но заставка работает нормально на странице загрузки. Я не использовал jquery / javascript. Я создал с заставкой в ​​анимации css3, когда я нажал кнопку выхода, то же самое повторилось снова всплескщелкнул экран при выходе из системы. Мне не нужен экран-заставка при нажатии кнопки выхода из системы. Я хочу только загрузить начальную страницу страницы, после чего я хочу удалить экран-заставку при выходе из системы. Однако повторяется та же анимация при выходе из системы. Как я могу удалить ее?выйти нажмите?я пытался .hide (), удалить (), но он не работает, пожалуйста, помогите мне .. как я могу сделать код при загрузке и выходе?

Css3 анимация

/* SPLASH SCREEN * -------------------------- */

#splash {
    background-color: #fc9204 !important;
    position: fixed;
    top: 0;
    height: 100vh;
    width: 100vw;
    z-index: 10;
    transition-property: top;
    -webkit-animation: slide-out-fwd-center  7.45s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
animation: slide-out-fwd-center  7.45s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
  }

 @-webkit-keyframes slide-out-fwd-center {
  0% {
    -webkit-transform: translateZ(1);
            transform: translateZ(1);
    opacity: 1;
  }
  100% {
    -webkit-transform: translateZ(600px);
            transform: translateZ(600px);
    opacity: 0;
  }
}
@keyframes slide-out-fwd-center {
  0% {
    -webkit-transform: translateZ(1);
            transform: translateZ(1);
    opacity: 1;
  }
  100% {
    -webkit-transform: translateZ(600px);
            transform: translateZ(600px);
    opacity: 0;
  }
}

 #splash img {
  display: block;
  margin: 200px auto;
  width: 100px;
  height: 200px;
  -webkit-animation: slide-fwd-center 0.45s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
animation: slide-fwd-center 0.45s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;

}


@-webkit-keyframes slide-fwd-center {
  0% {
    -webkit-transform: translateZ(0);
            transform: translateZ(0);
  }
  100% {
    -webkit-transform: translateZ(160px);
            transform: translateZ(160px);
  }
}
@keyframes slide-fwd-center {
  0% {
    -webkit-transform: translateZ(0);
            transform: translateZ(0);
  }
  100% {
    -webkit-transform: translateZ(160px);
            transform: translateZ(160px);
  }
}

1 Ответ

0 голосов
/ 14 октября 2018

Посмотрите эту ссылку на предыдущий вопрос, который уже задавался.

Могу ли я иметь эффект щелчка в CSS?

В нем показано, как проверить наличие щелчка в CSS, но я бы порекомендовал использовать JavaScript для проверки щелчка.Он универсален и способен на многое другое.Стоит хотя бы понять основы, чтобы создать несколько отличных веб-страниц.

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