Question

Alrighty所以这是我当前的jquery代码，在div“fbox”悬停时通过更改div“fbot”的类来替换背景

    <script>
 $(document).ready(function () {
$(function() {
     $("#fbox").hover(function () {
        $("#fbot").addClass("fboto");
    },
    function () {
        $("#fbot").removeClass("fboto");
    });
});
});



</script>

现在我想要的是将fadeIn和fadeOut添加到不断变化的背景中但是我不确定这样做的正确方法，我已经尝试了一些不同的安排它并没有按照方向或顺序工作我想要它......

这些div的html：

<div id="fbox">
<div id="ftop"></div> <!-- top of fullbox -->



<!-- middle of fullbox -->
<div id="fmid">
<!-- content for the fullbox goes BELOW here -->


<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />


<!-- content for the fullbox goes ABOVE here -->
</div>
<!-- end middle of fullbox -->



<div id="fbot" class="fbot"></div> <!-- bottom of fullbox -->

</div>

我要更改背景图片的简单css ..：

.fboto {
  width: 934px;
  background:url(images/cb/fboto.png) no-repeat;
  height: 17px;
  margin:0
 }

任何帮助都会很棒，谢谢！

Answer 1

jQuery UI允许您动画添加和删除类。只需包含jQuery UI的插件即可：

$("#fbot").addClass("fboto",duration,callBack);
$("#fbot").removeClass("fboto",duration,callBack);

供进一步参考：jQuery UI addClass

Jquery - 将fadeIn / fadeOut添加到悬停addclass函数

1 个答案: