How to implement a rollover graphic, need help…

  • Heya – so I’m working on this site: https://jen-novak-consulting.theportlandco.com

    And the image that appears in the upper left should swap when the user navigates over the different categories (which are listed in the middle column). Normally I would enter my mouseover/mouseout code straight into my “a” tag, like so:

    <a href="#" mouseover="" mouseout="">example</a>

    But the code that produces those links/list items is this:

    <?php wp_list_categories('&title_li='); ?>

    So I’m not sure how to implement that code? Or if maybe there is an alternative?

    Help! Thanks.

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

  • There is an alternative – that actually works better for valid coding. Put the mouseover code directly in the img tag instead.

    For example:
    <a href="#"><img src="normal" onmouseover="src='hover'" onmouseout="src='normal'" style="border-style;none;" /></a>

    Just make sure you use the “border-style:none;” tag otherwise you get the annoying blue box around your image in IE.

    Thread Starter Spencer Hill

    (@ws5f3dj7)

    Hey Eric – thanks for the suggestion! The only problem with that is if the mouseover is on the image than, obviously, the user has to mouseover the image and in my case the user needs to mouseover the navigation elements.

    I did find an interim solution, but it required me to implement that mouseover into the one WP core file, which is terrible practice any good developer will discourage, but in my case, deadline comes first.

    So if anyone knows a proper WP solution I would LOVE to hear it. Thanks!

    Did anyone ever find a proper solution to this issue? I’ve been killing myself trying to figure it out. W5f3dj7, could you possibly share the alterations you made to the WP core file to implement the rollover?

    Thanks!

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘How to implement a rollover graphic, need help…’ is closed to new replies.