How to Hide/Show Div on MouseOver

  • Today I am trying to manipulate the wp-e-commerce plugin. A link to the page I am working on can be found here. I found a jquery plugin that implements exactly what I am trying to do. ContentHover Plugin. If you reference the 4th example on the plugin site that is what I am looking for. I want the information that is currently below the product image (price, title, etc) to only show when you hover over the image. Then I want to image to be swapped with just a gray background and the information to be shown. Basically the affect they use on this site (hover over the products).

    I have attached the plugin to my header.php:

    <script type="text/javascript" src="<?php bloginfo('template_url'); ?>/js/jquery.contenthover.min.js"></script>
		<script>
		$('.infoMouseOver').item_image({
			overlay_background:'#333'
		});
		</script>

    Along with a link to jquery of course. This seems like a very simple script but I am not having and success with it. Any suggestions on how to achieve this desired affect?

    Thanks,
    Kevin

  • The topic ‘How to Hide/Show Div on MouseOver’ is closed to new replies.