wessbly

Question

我有以下代码：

div.slide-right {
  width:100%;
  overflow:hidden;
}

div.slide-right {
animation: 2s slide-right;
}

@keyframes slide-right {
  from {
    margin-left: -100%;
    width: 100%; 
  }

  to {
    margin-left: 0%;
    width: 100%;
  }
}
</style>

现在动画在页面加载后开始2s，我想在用户可见元素或鼠标悬停在某个元素上时启动它们。最好是第一个。

事情是我使用Weebly，添加jquery和这些东西有点困难。有没有更简单的方法呢？

非常感谢！

Answer 1

我设法使用http://jackonthe.net/css3animateit/执行此操作，就像在Weebly的代码片段中导入依赖项一样简单，然后像在网页中解释的那样添加类。

<div class='animatedParent'>
    <h2 class='animated bounceInDown'>It Works!</h2>
</div>