相关疑难解决方法(0)

如何旋转HTML <div> 90度？

我<div>想要旋转90度:

<div id="container_2"></div>

Run Code Online (Sandbox Code Playgroud)

我怎样才能做到这一点？

html css

use*_*433

2015 07-25

228
推荐指数

5
解决办法

39万
查看次数

在最后一帧停止CSS3动画

我有一个4部分CSS3动画点击播放 - 但动画的最后一部分是为了将其从屏幕上取下.

但是,它一旦播放就会回到原来的状态.任何人都知道如何在最后一个css帧(100%)上停止它,或者如何摆脱它曾经玩过的整个div.

@keyframes colorchange {
  0%   { transform: scale(1.0) rotate(0deg); }
  50%  { transform: rotate(340deg) translate(-300px,0px) }
  100% { transform: scale(0.5) rotate(5deg) translate(1140px,-137px); }
}

Run Code Online (Sandbox Code Playgroud)

css css3 css-animations

use*_*192

2015 07-02

170
推荐指数

4
解决办法

14万
查看次数

如何防止css关键帧动画在页面加载时运行？

我有一个div,我在其中制作动画内容:

#container {
  position: relative;
  width: 100px;
  height: 100px;
  border-style: inset;
}
#content {
  visibility: hidden;
  -webkit-animation: animDown 1s ease;
  position: absolute;
  top: 100px;
  width: 100%;
  height: 100%;
  background-color: lightgreen;
}
#container:hover #content {
  -webkit-animation: animUp 1s ease;
  animation-fill-mode: forwards;
  -webkit-animation-fill-mode: forwards;
}
@-webkit-keyframes animUp {
  0% {
    -webkit-transform: translateY(0);
    visibility: hidden;
    opacity: 0;
  }
  100% {
    -webkit-transform: translateY(-100%);
    visibility: visible;
    opacity: 1;
  }
}
@-webkit-keyframes animDown {
  0% {
    -webkit-transform: translateY(-100%);
    visibility: visible;
    opacity: 1;
  }
  100% {
    -webkit-transform: …

Run Code Online (Sandbox Code Playgroud)

css animation keyframe

Edu*_*rdó

2016 04-27

40
推荐指数

4
解决办法

3万
查看次数