HTML code for Rollover image when mouse over in the Text widget

savorytouch · Member · Jan 30, 2016 at 8:54 am
Copy link

Add topic to favorites
What html code will work in the text widget for creating rollover images during mouse over in the text widget? I am using free wordpress, so I don’t have access to any sort of plugins and I am also using a pre-made theme so I don’t have access to that code either. My goal is to recreate my social icons as the pre-made theme is too limited.

I have tried to use this example:
```
<a href="TARGET URL GOES HERE">
    <img style="border:0 none;" title="" alt="" src="URL OF FIRST IMAGE GOES HERE"
         onmouseover="this.src='URL OF SECOND IMAGE GOES HERE';"
         onmouseout="this.src='URL OF FIRST IMAGE GOES HERE';">
    </img>
</a>
```
An example with my links:
```
<a href="https://www.facebook.com/savorytouchblog">
 <img style="border:0 none;" title="Follow me on Facebook!" alt="" src="http://i.imgur.com/hNZTnkr.png"
   onmouseover="this.src='http://i.imgur.com/88yjksK.png';"
   onmouseout="this.src='http://i.imgur.com/hNZTnkr.png';">
 </img>
</a>
```
However, nothing happens when I mouse over it. You can see an example on my blog at the last widget on the right side bar. What else am I missing?

The blog I need help with is: (visible only to logged in users)
savorytouch · Member · Feb 4, 2016 at 6:23 pm
Copy link
anybody??
banhgao · Member · Feb 5, 2016 at 1:35 am
Copy link
Hi there. OnMouseOver is Javascript which can’t be used at WordPress.com. However with the Custom Design upgrade, you can do that.
See this post for instructions: https://wpbtips.wordpress.com/2013/05/20/rollover-images/
savorytouch · Member · Feb 8, 2016 at 11:27 pm
Copy link
@banhgao , Thank you for the reply, but is there no other way to do it the free way and just HTML?
banhgao · Member · Feb 11, 2016 at 12:35 pm
Copy link
I think there is no way :)

No items found.