如何在png中创建一个握手效果？

Question

我有一个png，我希望双手握手。我正在提供图片链接：

请更喜欢使用CSS，JS，HTML和jquery来执行此操作：

http://i.stack.imgur.com/0YmwS.png

Answer 1

css足以达到震撼效果：

.handshake:hover {
  animation: shake 0.82s cubic-bezier(.36,.07,.19,.97) both;
  transform: translate3d(0, 0, 0);
  backface-visibility: hidden;
  perspective: 1000px;
}

@keyframes shake {
  10%, 90% {
    transform: translate3d( 0, -1px, 0);
  }

  20%, 80% {
    transform: translate3d(0, 2px, 0);
  }

  30%, 50%, 70% {
    transform: translate3d(0, -4px, 0);
  }

  40%, 60% {
    transform: translate3d(0, 4px, 0);
  }
}

但要使其逼真，您需要为图像本身中的元素设置动画。您可以使用像Adobe Animate（前Flash）这样的程序来导出动画gif（这将是btw。看起来更加丑陋并占用更多空间，然后是flash的主要导出格式swf）。