关键帧百分比中断了几秒钟

时间:2018-10-13 22:48:08

标签: css animation

此具有像素的代码可以完美运行,但秒数变化%。

您能帮我找到解决方案吗? 谢谢您在这个问题上的所有帮助。

我需要写点东西...然后我写这个。

/* .qt-quotes */
.qt-quotes {
  width: 600px;
  background: linear-gradient(to right, grey 10px, white 0);
  animation: qt-qotes-height 1s normal both, qt-qotes-width 1s normal 1s both, qt-qotes-shadow 1s 2s normal both;
}

.qt-quotes p {
  height: max-content;
  width: max-content;
  padding: 2.5px 20px;
  animation: qt-qotes-text 1s 2s normal both;
}

@keyframes qt-qotes-height {
  from{max-height: 0;}
  to{max-height: 100%;}
}

@keyframes qt-qotes-width {
  from{max-width: 10px;}
  to{max-width: 100%;}
}

@keyframes qt-qotes-text {
  from{visibility: hidden;; opacity: 0;}
  to{visibility: visible; opacity: 1;}
}

@keyframes qt-qotes-shadow {
  from {box-shadow: none;}
  to {box-shadow: 0px 0px 30px 0px grey;}
}

/* .qt-not-copyable */

.qt-not-copyable {
	user-select: none;
}
	  <div class="qt-quotes qt-not-copyable">
		  <p><i>"This isn't a second..."</i></p>
      <p>idk</p>
	  </div>

0 个答案:

没有答案