photo js

<div class="staff-member" >
 <div class="span2">
	<img alt="Per L. Saxegaard : Founder and Executive Chairman" src="http://bfp-new-mashpy-1-1.c9users.io/wp-content/uploads/2014/04/V6M4083.jpg" class="staff-member-photo">
	<div class="staff-member-info-wrap">
		<h3 class="staff-member-name">Per L. Saxegaard</h3>
		<h4 class="staff-member-position">Founder and Executive Chairman</h4>
		<a title="Email Per L. Saxegaard" href="mailto:[email protected]" class="staff-member-email">[email protected]</a>
	</div>
</div>   
    </div>
    
    
    .staff-member .span2 {
    display: inline-block;
    background: black;
    padding: 0;
}


.staff-member .span2 .staff-member-info-wrap{
    display:none;
    position:absolute;
    top:0px; left:0px;
    float:left;
    color:white
}

.staff-member .span2 img {
    display: block;
    
    -webkit-transition: all 0.5s linear;
       -moz-transition: all 0.5s linear;
        -ms-transition: all 0.5s linear;
         -o-transition: all 0.5s linear;
            transition: all 0.5s linear;
}

.staff-member .span2:hover img {
    opacity: 0.7;
            
}

.staff-member-photo {width: 200px}



$('.staff-member .span2').hover(
    function(){
       $(this).find('.staff-member-info-wrap').fadeIn(300); 
    },
    function(){
       $(this).find('.staff-member-info-wrap').fadeOut(300); 
    }
    );