使用内联代码更改悬停图像 [英] change image on hover with inline code

问题描述

我正在尝试改变悬停时的图片。我尝试了很多方法，但没有任何工作。我必须使用这样的东西。如果这个代码有问题请告诉我。提前致谢

代码

  < a href =https://my-website.com/results/testimonials-global-supply-chain-group/\"> 
< img id =home-buttonalt =src =https://my-website.com/wp-content/uploads/2017/11/businessman-2606509_1920_20171107090703313.jpg
 onmouseover =$（this）.attr（'src'，'https：//my-website.com/wp-content/uploads/2017/10/testimonialpage.jpg'）; 
 onmouseout =$（this）.attr（'src'，'https：//my-website.com/wp-content/uploads/2017/10/businessman-2606509_1920_20171107090703313.jpg'）;> 
< / a> 
  

解决方案

您需要做的第一件事是检查if你已经包含jQuery并查看控制台的错误。另外，你不需要像你在代码中做的那样做很多事情。您可以使用 this.src ：

 < a href =＃> < img src =// placehold.it/100?text=Helloonmouseover =this.src ='// placehold.it/100?text=Over'onmouseout =this.src ='// placehold .it / 100？text = Hello'alt =/>< / a>  

$ b

清单

1. 检查控制台。 b
2. 是否加载了jQuery？


3. 图片路径是否正确？

I am trying to change image on hover. I have tried many ways but nothing is working. And i have to use something like this. Please if there is some problem with this code tell me. Thanks in Advance

Code

    <a href = "https://my-website.com/results/testimonials-global-supply-chain-group/">
    <img id = "home-button" alt = "" src = "https://my-website.com/wp-content/uploads/2017/11/businessman-2606509_1920_20171107090703313.jpg" 
     onmouseover="$(this).attr('src','https://my-website.com/wp-content/uploads/2017/10/testimonialpage.jpg');" 
     onmouseout="$(this).attr('src','https://my-website.com/wp-content/uploads/2017/10/businessman-2606509_1920_20171107090703313.jpg');">
    </a>

解决方案

First thing that you need to do is to check if you have included jQuery and look at the console for errors. Also, you don't need to do much like how you have done in your code. You can just use this.src:

<a href="#">
  <img src="//placehold.it/100?text=Hello"
       onmouseover="this.src='//placehold.it/100?text=Over'"
       onmouseout="this.src='//placehold.it/100?text=Hello'"
       alt=""
  />
</a>

Checklist

1. Check the console.
2. Is jQuery loaded?
3. Is the image path correct?

这篇关于使用内联代码更改悬停图像的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！