当前位置: 首页 > 面试题库 >

使用jQuery更改图片来源

路阳华
2023-03-14
问题内容

我有一些图像及其翻转图像。使用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);

            });
    });


 类似资料:
  • 问题内容: 我正在写一个Ajax联系表格。我也写了我自己的验证码。但是我有刷新图像的问题。我这样写: 重新加载验证码: 和captcha_p.php文件: 并且我已将以下行添加到capcha.php中: 它在Google Chrome和Safari上完美运行。但不适用于Firefox和资源管理器。 谢谢! 问题答案: 看来Firefox和IE正在缓存图像。为防止这种情况,请将时间戳记附加到URL和

  • 问题内容: 我有此jquery代码,可在单击时更改背景图像: 但是,它没有改变。有什么我想念的吗? 问题答案: 您需要包括该属性的一部分。

  • 问题内容: 我有一个图像,单击该图像时,我想在其下方显示另一个图像。我正在寻找一个简单的CSS only解决方案。 那可能吗? 问题答案: 您可以使用具有不同样式的标签:

  • 问题内容: 我是javascript的初学者,我想根据下拉菜单中的选项更改图像(选择),但是遇到一些问题。 在本教程中,如果要使用代码,它们将用您要使用的图片文件名替换iljbild,因为图片文件的名称必须与示例中的类型相同,即唯一区分文件的应该是数字,例如pict0.gif,pict2.gif等。如果使用的是jpg图片,则必须用jpg替换gif。设置图像的宽度和高度,如果在选择列表中更改单词的长

  • 问题内容: 我的页面上有几个画廊,包括手风琴和滑杆。问题是页面需要永久加载。有没有一种方法可以将图像包装在一些代码中或对它应用类以强制仅在加载所有其他内容之后才加载它? 问题答案: 你当然可以。将您的img src属性替换为“#”,然后添加一个自定义属性,如下所示: 然后,在页面加载时添加一条JavaScript行,该行的内容如下所示:

  • 问题内容: 有没有一种方法可以使用jQuery更改CSS类的属性,而不是元素属性? 这是一个实际的例子: 我上课有一个div 我想更改类背景属性,而不是已分配类背景的元素。 如果我使用jQuery .css()方法做到这一点: 它会影响现在具有class的元素。到这里为止一切都很好。但是,如果我进行Ajax调用,并在class中插入更多div ,则这些背景将不会具有绿色背景,而它们将具有初始背景。