Javascript 悬停时淡入/淡出背景图像

而不是从左到右、从右到左的过渡。我怎样才能使它淡入淡出，没有运动，只是不透明淡出，淡入

---

如果您对jquery没有意见，请查看

点击这里
//在元素最初隐藏的情况下，我们可以缓慢地显示它：
$（“#单击我”）。单击（函数（）{
$（“#book”）.fadeIn（“慢”，函数（）{
//动画完成
});
});

您可以使用CSS3属性不透明度和转换来完成此操作

这里举一个例子：

---

jquery是一个选项吗？您能更新您的示例使之成为这样吗？但使用fade：您能提供这样的示例吗？但随着褪色？

<div id="clickme">
  Click here
</div>
<img id="book" src="book.png" alt="" width="100" height="123">

// With the element initially hidden, we can show it slowly:
$( "#clickme" ).click(function() {
  $( "#book" ).fadeIn( "slow", function() {
    // Animation complete
  });
});

.yourClass
{
    opacity: 1;
    transition: all 3s ease;
} 

.yourClass:hover 
{
    opacity: 0;
}