Question

如何用jquery上下漂浮的动画效果

Answer 1

@-webkit-keyframes bounce-down {
  25% {
    -webkit-transform: translateY(-3px);
  }
  50%, 100% {
    -webkit-transform: translateY(0);
  }
  75% {
    -webkit-transform: translateY(3px);
  }
}
@keyframes bounce-down {
  25% {
    transform: translateY(-3px);
  }
  50%, 100% {
    transform: translateY(0);
  }
  75% {
    transform: translateY(3px);
  }
}
.animate-bounce-down{
  -webkit-animation: bounce-down 1.3s linear infinite;
  animation: bounce-down 1.3s linear infinite;
}

如果不考虑低版本兼容，css3动画可以简单实现，给需要漂浮的元素添加animate-bounce-down这个类就好，浮动效果可以自行调试