我有一个< div>其中包含背景图片,< div>坐在HTML的工具栏中.
HTML:
- <div id="toolbar">
- <div class="image"> </div>
- </div>
CSS:
当鼠标悬停在#toolbar上时,我想要更改.image的背景图像,但使用.fadeOut()和.fadeIn()
到目前为止我有:
- $("#toolbar").hover(function () {
- $(".image").fadeOut("slow");
- $(".image").addClass("imagehover");
- $(".imagehover").fadeIn("slow");
- },function () {
- $(this).removeClass("imagehover");
- });
目前徽标淡出,悬停徽标淡出两次.
任何帮助赞赏.
解决方法
- //Use the fad in out callback
- $("#toolbar").hover(function () {
- $(".image").fadeOut("slow",function () {
- $(this).addClass("imagehover").fadeIn("slow",function () {
- $(this).removeClass("imagehover");
- });
- });
- });
- //or you can use animate
- $("#toolbar").animate({
- "class": "imagehover"
- },"slow",'easein',function () {
- //do what every you want
- });