Rollover/Mouseover

• 

  willym01 · Member · Oct 6, 2016 at 12:57 am

  • Copy link
  • Add topic to favorites

  Some time back I added a code in CSS that was recommended to enable rollovers

  .roll .rollover, .roll:hover .regular {
  display: none;
  }

  .roll:hover .rollover {
  display: block;
  }

  (function(d, s, id) {
  }

  I have not used it in some time and cannot find any html code that seems to work with it. The regular help line had no suggestions but thought maybe I would find some assistance here. I

  The blog I need help with is: (visible only to logged in users)

• 

  hallluke · Member · Oct 6, 2016 at 6:36 am

  • Copy link

  Your theme doesn’t seem to have any elements with either of the classes roll or rollover so the code isn’t doing anything at the moment. Also the third line of code you have is javascript not CSS so it’s being stripped out when you try to save it.

  What sort of thing are you trying to achieve?

• 

  willym01 · Member · Oct 6, 2016 at 11:28 pm

  • Copy link

  Halluke
  I copied the CSS code from a previous forum on here where one of the support staff suggested it. And what I was trying to do was add a simple rollover to a blog post – replacing a picture of building in 1900 with a picture of the same building today. Nothing fancy at all. I was certain I had used it previously on a post but can’t remember what of the many posts it was on. It was something that was fairly easy accomplished on Blogspot but I gather is not possible on WordPress unless you upgrade to .org.

• 

  hallluke · Member · Oct 7, 2016 at 7:27 am

  • Copy link

  Changing an image when the mouse hovers over it is definitely possible with CSS but each theme is slightly different so the CSS code would need to be modified to reflect that. If you’re still interested in setting this up then publish a test page and include your two images on it (ideally two that are the same size or proportion). Then post the URL to the page here and I’ll take a look and see if I can help out further.