Mouse Wheel Over effect create issue with two different width and height.

Please check this link http://cashmoney-records.umg-wp-stage.com/artist-info/birdman-2/
Here, Two different width and height images

Album and Single images have 195 x 195 px
and Videos image have 238 x 137 px

How can we mouse wheel over effect with these two different size at a time on single.php please check script …

<————————- Html (single.php) ———————————>

<span class="slider-th">
<span class="client-th captionfull">

<span class="rimage">
<a>" id="videos" rel="prettyPhoto[inline]" class="bsi">
<?php echo types_render_field('image-for-video-page', array('title' => get_the_title(), 'size' => 'videod', 'alt' => ' ', 'proportional' => true)); ?>
</a>
</span><!– rimage –>

<span class="cover boxcaption">
<h5><a>" id="videos" rel="prettyPhoto[inline]" class="bsi"> <?php echo the_title(); ?></a></h5>
<p><a>" id="videos" rel="prettyPhoto[inline]" class="bsi"> Watch Video</a></p>
</span><!–cover boxcaption –>
</span><!–Client Thumb Ends–>
<span class="clr"></span
</span><!– slider th –>

<——————– Script and CSS (single.php) ———————— >

<!–mouse wheel –>
<script type="text/javascript">
$(document).ready(function(){
$('.client-th.captionfull').hover(function(){
$(".cover", this).stop().animate({top:'0'},{queue:false,duration:160});
}, function() {
$(".cover", this).stop().animate({top:'195px'},{queue:false,duration:160});
});
});
</script>
<!– mouse wheel –>

<style>

.slider-th .client-th {width:195px; height:195px; float:left; position:relative; margin:0 0 0 0; overflow:hidden; border:#0F0 soldi 1px; }
.sliderclient .boxcaption {position: absolute; background:#b50000; height:0; width:100%;
/* For IE 5-7 */
filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=80);
/* For IE 8 */
-MS-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";
z-index:-3;
}
.slider-th .boxcaption {position: absolute; background:#b40000; height:196px; width:100%; opacity: .8;
/* For IE 5-7 */
filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=90);
/* For IE 8 */
-MS-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";
z-index:1;
}
.slider-th .boxcaption h5 a {margin:34px 0 0 10px; float:left; font: 13px "rockeb";
color:#f4f4f4;
text-decoration:none;
text-transform:uppercase;
width:170px;
height:auto;
text-align:center;
}
.slider-th .boxcaption p a {margin:0 0 0 0; float:left; color:#fff; font: bolder 20px "rockwelllight"; width:195px; font-weight:bold; text-align:center; text-decoration:none;}
.slider-th .captionfull .boxcaption {
top: 355px;
left: 0;
}

</style>

[please remember to mark any posted code – http://codex.wordpress.org/Forum_Welcome#Posting_Code – some of the above codes are corrupted by the forum’s parser]

How can we apply this html and script with 238 x 137 px on same page single.php????

we are looking for the above question we asked, as we have issue with mouse hover effect on two different sizes of thumbnails, can you please look in to the above code we wrote with the link we given, so that you can get a complete picture and suggest us a best solutions, Every one will be appreciated for their support in this regards, Thanks