image mouseover works when editing page, not when published

  • Resolved dora_m

    (@dora_m)


    11 years, 9 months ago

    Hi, I’ve got a few icons on my homepage which I would like to have change on mouseover. They all work when I’m looking at the page in editing mode, but when I publish it only one works.

    Here’s the site: doramitchell.com

    Here’s the code I’m using for the mouseover images:
    <a href="https://www.doramitchell.com/portfolio_tag/creatures" rel="attachment wp-att-273"><img class=" wp-image-273 alignleft" onmouseover="this.src='https://www.doramitchell.com/portfolio/wp-content/uploads/2013/01/oddities1.jpg'" onmouseout="this.src='https://www.doramitchell.com/portfolio/wp-content/uploads/2013/01/oddities2.jpg'" alt="illustrations of creatures" src="https://www.doramitchell.com/portfolio/wp-content/uploads/2013/01/oddities2.jpg" width="175" height="266" /></a>

    That’s the image that works on the published page.

    <a href="https://www.doramitchell.com/portfolio_tag/people" rel="attachment wp-att-581"><img class=" wp-image-581 alignright" onmouseover="this.src='https://www.doramitchell.com/portfolio/wp-content/uploads/2013/01/people2_72dpi1.jpg'" onmouseout="this.src='https://www.doramitchell.com/portfolio/wp-content/uploads/2013/01/people1_72dpi1.jpg'" alt="illustrations of people" src="https://www.doramitchell.com/portfolio/wp-content/uploads/2013/01/people1_72dpi1.jpg" width="150" height="280" /></a>

    THat’s the code for one of the non-working images. I don’t see any differences… Any help would be much appreciated! ??

Viewing 2 replies - 1 through 2 (of 2 total)

  • I took a look at your site, and the code I see for the “people” images looks like this:
    <img width="150" height="280" src="https://www.doramitchell.com/portfolio/wp-content/uploads/2013/01/people1_72dpi1.jpg" alt="illustrations of people" onmouseout="this.src='https://www.doramitchell.com/portfolio/wp-content/uploads/2013/01/people1_72dpi1.jpg'" onmouseover="this.src='https://i1.wp.com/www.doramitchell.com/portfolio/wp-content/uploads/2013/01/people1_72dpi1.jpg?resize=150%2C280'" class=" wp-image-581 alignright">
    See how the URL for the onmouseover event is:
    https://i1.wp.com/www.doramitchell.com/portfolio/wp-content/uploads/2013/01/people1_72dpi1.jpg?resize=150%2C280
    If I browse to that URL, it is the same image, so it appears the onmouseover isn’t working, when it really is.

    I’m not seeing any javascript errors, so I believe your code is correct except for the onmouseover URL. Since the code I’m seeing is not what you have above, maybe what I’m seeing is a cached version of the page if you have a caching plugin installed and activated?

    Cool images, by the way.

    Thread Starter dora_m

    (@dora_m)

    Thank you!!

    It was the caching, I guess — I turned off Photon in Jetpack and now it’s working. I had noticed that the image URLs were changing to “i1.wp.com” but I didn’t realize why that was happening or what it was doing!

    Thanks again for your help ??

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘image mouseover works when editing page, not when published’ is closed to new replies.