Question

I know there are multiple variations of this scenario but I’ve struggled making it work.

I’m attempting something very close to yellowpages.com Just do a search for pizza, or anything for that matter to get the results to populate.

Notice how a “DIV” is revealed on the hover of each individual element? The actions at the bottom of each listing? I need to do this. I have a very similar project that I’m working on that creates listings based off of database content.

The best way to explain would be if I were able to change the z-index of the “footer” when hovering over the main container of the entire listing.

This is my first post on this site.. Thanks so much for your help.

Answer 1

It is fairly easy to do this in jQuery. To show or hide a div you can use:

$(".moreInfoDiv").show();
$(".moreInfoDiv").hide(); 

Of course assuming that you have defined your divs already

<div class="div1">
<div class="moreInfoDiv">

So your final code show look something like this

$('.div1').hover(
    function() {
       $(".moreInfoDiv").show();
    },
    function() {
        $(".moreInfoDiv").hide();
    }
);