ProLavish | Blogger GuruProLavish

A blog provide Blogging Ethics

Create Rollover Image Effect For blog(UPDATED)


how to Create Rollover Image Effect For blog in blogger.
The Rollover image  effect is the effect in which an image swaps  to another image on mouse hover and  reverts back to the previous image on mouse out.

The Rollover image  effect is the effect in which an image swaps  to another image on mouse hover and  reverts back to the previous image on mouse out. They are preloaded into the page to ensure its  displayed quickly on mouse hover .
Using 2 function "onMouseOver" and "onMouseOut" attributes of the link tag  which are required for this effect.

Thanks to Helplogger AND Wikipedia for this article

Rollover Image Effect For blog



Create Rollover Image Effect For blog
Create Rollover Image Effect For blog


Below is the example

  

<a href=" LINK TO ATTACH">

<img src="1st IMAGE URL" onmouseover="this.src='2nd IMAGE URL'" onmouseout="this.src='1st IMAGE URL'" />

</a>

 
Steps to Add  Rollover Image Effect 


  1. Sign in to Blogger.
  2. Select the blog to update.
  3. In the left menu of your blog , click posts
  4. Clcik on title of post to attach image.
  5.  A window  appears,  Switch to HTML tab  then paste below code .
  6. Set your required setting &  click Save

Setting to change for  Rollover Image Effect -



1. LINK TO ATTACH

Url address to attach with image

Example, my blog address: https://prolavish.blogspot.com/



2. 1st IMAGE URL

Replace the text with the URL address of the image which will appear before you hover over it



3. 2nd IMAGE URL

Replace the text with the url of  the image that will appear when the cursor hovers over it.



Note-No javascript and hidden ads are used. To ensure user security





Have Questions?

If you need help with respect to any concept do post your comment below..We are happy to help you  

Gaurav dudeja

Gaurav Dudeja has 3 years of blogger experience.He wasthe only owner of prolavish .He does internet blogging and sharingblogging ethics,widgets,quality tips based on blogging.Having More than 50 followersand 250 people subscribed his blog Join me . Prolavish receives 1 thousand Pageviews/month and has over 32K subscribers

You can find us on

Read Comment Policy ▼
  We have Zero Tolerance to Spam. Chessy Comments & Links' will be deleted immediately

Comments are moderated and may take some time to appear.
If you ask a question make sure you tick the Notify Me option

No comments:     Post Yours!