How do I utilise Rollover Images within WordPress?

  • Author
  • #528668



    How do I add Rollover Images to my WordPress blog?

    The plan is to upload an image for the header, and on mouse-rollover, the header temporarily inverts or is ephemerally replaced by a different header image.

    Please tell me how to do this using WordPress.

    Thanks in advance,

    Chip D. Panarchy

    The blog I need help with is



    Hmm, appears this website has a nice tutorial, using jQuery;

    Would you recommend installing & using jQuery on my blog just for that effect, or would it be worth implementing in CSS or plain-javascript instead?



    I recommend you give us the URL of the blog in question, starting with http. The answer depends on the blog.


    Is there an easy answer to this question that anyone know of?

    I’m working on an advent calendar for next month and would like to make it a bit groovy with rollover images.



    Thanks again timethief.
    As I’m not web-clever and don’t have the upgrade, I think i’ll just go lo-fi and keep it simple!


    There is a way to do rollovers with CSS also, but it would require some CSS experience and the paid CSS upgrade.

    I’ve found some HTML only rollover code, but cannot get it to work here at WordPress keeps changing the code on my and messing it up.



    How would you go about doing this with the upgrade?


    Do a search for “css only image rollover” and you will find a number of examples. You will have to look through them to see which will work best for you.



    Is it supported in WordPress?



    Im wanting to do the exact same thing. I just bought the upgrade, have NO css experience whatsoever, but am willing to learn. Im trying to do a mouse roll-over for a before and after picture, you see the before, and once your mouse moves over the image, the after photo shows up.

    Anybody care to help me figure this one out? Id GREATLY appreciate it!



    You are not advised to buy the upgrade if you don’t already know how to use CSS. We generally recommend you practice with the free Preview till you’re good enough to make the changes you want.


    Take a look at this recent thread on the same subject. Hallluke provides a way to do it.

The topic ‘How do I utilise Rollover Images within WordPress?’ is closed to new replies.