Ключевые кадры не работают должным образом в сафари - PullRequest
Новая
       13

Ключевые кадры не работают должным образом в сафари

0 голосов
/ 31 мая 2019

Я работаю над сайтом, и у меня есть анимированный логотип SVG. Он работает, как и ожидалось, в Chrome и Firefox, но что-то не так с dashoffset в Safari. Это сказанное, это действует странно на сафари, работая только с непрозрачностью.

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

.header-logo {
  stroke: #ffed16;
  stroke-width: 0.5;
  stroke-dasharray: 300;
  opacity: 10;
  animation: animate 2.5s cubic-bezier(0.17, 0.67, 0.83, 0.67);
}
@keyframes animate {
  0% {
    opacity: 0;
    fill: none;
    stroke-dashoffset: 400;
    stroke-width: 0.5;
  }
  50% {
    opacity: 10;
    fill: none;
    stroke-width: 0.5;
  }
  70% {
    fill: rgba(254, 215, 0, 0);
    stroke-width: 0.5;
  }
  80% {
    stroke-dashoffset: 100;
  }
  90% {
    stroke-width: 0.5;
  }
  100% {
    opacity: 10;
    fill: rgba(254, 215, 0, 1);
    stroke-width: 0.5;
    /* stroke-dashoffset: 0; */
  }
}

спасибо за привет.

...