本文演示了当
鼠标滑过一个小图时jQuery
显示出大
图片的方式,供大家
参考,具体的实现
方法如下:
复制代码代码如下所示:
李{列表样式:无;浮动:左;margin-left: 10px;}
var数据{ {
图像/ 11_s .webp:{图像/ 11_b .webp
图像/ 22_s .webp:{图像/ 22_b .webp
图像/ 33_s .webp:{图像/ 33_b .webp
图像/ 44_s .webp:{图像/ 44_b .webp
};
$(
函数(){())
$(数据、函数(键、值){)
初始化最后div隐藏
$();
创建一个小的映射/节点
无功smallpath = $()。Css({缘:5px
设置名称和
地址/映射
bigimgpath = smallpath.attr(bigmappath
bigimgname = smallpath.attr(bigmapname
$(div)。弗斯特()添加(smallpath);
图添加事件
smallpath.mouseover(函数(){()
最后,一个div /淡入淡出效果
$(div)。去年()。FadeIn(快速);
获取图片/地址
$(#秀)Attr(src。
获取并设置样式名称图片
$(# imgtitle)。
文本($(this)。Attr(bigmapname )),Css({
背景):# ebf1de
});
smallpath.mouseout(函数(){()
$(div)。去年()。FadeOut(快速);
});
});
});
希望本文能对大家的jQuery
程序设计有所帮助。