使用jQuery更改图片来源

• Z时代
• 2024-01-10
• 分类：问答

我有一些图像及其翻转图像。使用jQuery，我想在onmousemove /

onmouseout事件发生时显示/隐藏过渡图像。我所有的图像名称都遵循相同的模式，如下所示：

原始图片： Image.gif

展期图片： Imageover.gif

我想分别在onmouseover和onmouseout事件中插入和删除图像源的 “结束” 部分。

如何使用jQuery？

回答：

要准备就绪，请执行以下操作：

$(function() {
    $("img")
        .mouseover(function() { 
            var src = $(this).attr("src").match(/[^\.]+/) + "over.gif";
            $(this).attr("src", src);
        })
        .mouseout(function() {
            var src = $(this).attr("src").replace("over.gif", ".gif");
            $(this).attr("src", src);
        });
});

对于使用url图片源的用户：

$(function() {
        $("img")
            .mouseover(function() {
               var src = $(this).attr("src");
               var regex = /_normal.svg/gi;
               src = this.src.replace(regex,'_rollover.svg');
               $(this).attr("src", src);
            })
            .mouseout(function() {
               var src = $(this).attr("src");
               var regex = /_rollover.svg/gi;
               src = this.src.replace(regex,'_normal.svg');
               $(this).attr("src", src);
            });
    });

以上是 使用jQuery更改图片来源 的全部内容， 来源链接： utcz.com/qa/410851.html