Question

我正在尝试在div上添加效果，一旦你将鼠标悬停在块上，该块就会向上移动。我正在使用Jquery转换，因为我知道ie10下的任何内容都不支持css转换。目前我可以让它移动，但对运动没有影响（只使用css）。我不确定如何开始添加jquery转换。

此刻我得到了它，一旦你将鼠标悬停在块上，它就会增加一个类。

$(document).ready(function () {
    $(".container").hover(function () {
        $(this).toggleClass("animated-effect");
    });
});

继承我的jsfiddle，我无法让代码与我的js一起工作： http://jsfiddle.net/4bgj4959/

Answer 1

您正在寻找animate方法。请注意，hover方法有两个参数，第二个参数用于onmouseout（当你完成悬停时）。

$(document).ready(function() {
  $(".container").hover(function() {
    $(this).animate({
      top: '20px'
    })
  }, function() {
    $(this).animate({
      top: '0px'
    })
  });
});

.container {
  width: 500px;
  height: 100px;
  border: 1px solid #00c;
  position: relative;
  top: 0px;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="container">
</div>

Answer 2

您的代码正在运行，但未包含jquery，请参阅更新fiddle
demo

块上的jquery过渡效果

2 个答案: