当用户将鼠标滑过美国地图上的地图区域时,我有这段代码可以更改图像。运行良好。但是我希望图像具有平滑的外观,然后逐渐消失。我需要在此代码中添加什么?谢谢!
$(document).ready(function() {
//set off state
var nav_off = "/images/state-map.png";
// functions for over and off
function over(image) {
$("#main-nav").attr("src", image);
}
function off() {
$("#main-nav").attr("src", nav_off);
}
$("#imagemap area").hover(
function () {
var button = $(this).attr("id");
over("/images/state-" + button + ".png");
},
function () {
off();
});
});
最佳答案
尝试使用jQuery的fadeOut / fadeIn效果。
也许是这样的:
function over(image) {
$("#main-nav").fadeOut(function () {
$(this).attr("src", image).fadeIn();
});
}
function off() {
$("#main-nav").fadeOut(function () {
$(this).attr("src", nav_off).fadeIn();
});
}