相关疑难解决方法(0)

使用CSS进行环形动画

我想要一个从的中心开始div而不是从的左上角开始的扩展半径div

想象一下,按钮有一个向外跳动的轮廓。该脉动轮廓应该从中间开始div,然后向外走。

在此处查看示例:https : //jsbin.com/dinehoqaro/edit?html,css,output

您可以看到扩展从左上方开始。

.circle {
  background-color: white;
  border: 1px solid red;
  border-radius: 50%;
  width: 50px;
  height: 50px;
  animation: pulse 1s infinte;
  -webkit-animation: pulse 1.2s infinite;
}
button {
  background-color: green;
  border: none;
  border-radius: 50%;
  width: 50px;
  height: 50px;
}
@-webkit-keyframes pulse {
  from {
    width: 50px;
    height: 50px;
  }
  to {
    width: 100px height: 100px;
  }
}
@keyframes pulse {
  from {
    width: 50px;
    height: 50px;
  }
  to {
    width: …
Run Code Online (Sandbox Code Playgroud)

html css css3 flexbox css-animations

3
推荐指数
1
解决办法
1753
查看次数

标签 统计

css ×1

css-animations ×1

css3 ×1

flexbox ×1

html ×1