HTML:
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<!---begin 4 column row-->
<tr>
<td valign="middle" align="center">
<!---begin single thumb box-->
<table width="136" border="0" cellspacing="0" cellpadding="0" class="fourColRowPad">
<tr>
<td width="136" align="center">
<a href="detail_vertical.php">
<img src="images/fpo_thumb_num2.jpg" border="0" onload="this.className='qlButton'" onmouseover="this.className='qlOn'" onmouseout="this.className='qlButton'" /> </a>
<a href="modal.php" onclick="openMyModal('modal.php'); return false;">
<img onload="this.className='qlWayLo'" onmouseover="this.className='qlWayHi'" onclick="this.className='qlWayHi'" onmouseout="this.className='qlWayLo'" src="images/QuickViewButton.png" border="0"/> </a> </td>
</tr>
</table>
<!---end single thumb box--> </td>
<td valign="middle" align="center">
<!---begin single thumb box-->
<table width="136" border="0" cellspacing="0" cellpadding="0" class="fourColRowPad">
<tr>
<td width="136" align="center"><a href="detail_vertical.php"> <img src="images/fpo_thumb_num1.jpg" border="0" onload="this.className='qlButton'" onmouseover="this.className='qlOn'" onmouseout="this.className='qlButton'" /> </a><a href="modal.php" onclick="openMyModal('modal.php'); return false;">
<img onload="this.className='qlWayLo'" onmouseover="this.className='qlWayHi'" onclick="this.className='qlWayHi'" onmouseout="this.className='qlWayLo'" src="images/QuickViewButton.png" border="0"/> </a> </td>
</tr>
</table>
<!---end single thumb box--> </td>
<td valign="middle" align="center">
<!---begin single thumb box-->
<table width="136" border="0" cellspacing="0" cellpadding="0" class="fourColRowPad">
<tr>
<td width="136" align="center"><a href="detail_vertical.php"> <img src="images/fpo_thumb_num4.jpg" width="102" height="159" border="0" onmouseover="this.className='qlOn'" onmouseout="this.className='qlButton'" onload="this.className='qlButton'" /> </a><a href="modal.php" onclick="openMyModal('modal.php'); return false;">
<img onload="this.className='qlWayLo'" onmouseover="this.className='qlWayHi'" onclick="this.className='qlWayHi'" onmouseout="this.className='qlWayLo'" src="images/QuickViewButton.png" border="0"/> </a> </td>
</tr>
</table>
<!---end single thumb box--> </td>
</tr>
<!---end 4 column row-->
<!---begin 4 column row-->
<tr>
<td valign="middle" align="center">
<!---begin single thumb box-->
<table width="136" border="0" cellspacing="0" cellpadding="0" class="fourColRowPad">
<tr>
<td height="136" width="136" align="center">
<a href="detail_vertical.php">
<img src="images/fpo_thumb_num2.jpg" border="0" onload="this.className='qlButton'" onmouseover="this.className='qlOn'" onmouseout="this.className='qlButton'" /> </a>
<a href="modal.php" onclick="openMyModal('modal.php'); return false;">
<img onload="this.className='qlWayLo'" onmouseover="this.className='qlWayHi'" onclick="this.className='qlWayHi'" onmouseout="this.className='qlWayLo'" src="images/QuickViewButton.png" border="0"/> </a> </td>
</tr>
</table>
<!---end single thumb box--> </td>
<td valign="middle" align="center">
<!---begin single thumb box-->
<table width="136" border="0" cellspacing="0" cellpadding="0" class="fourColRowPad">
<tr>
<td height="136" width="136" align="center">
<a href="detail_vertical.php">
<img src="images/fpo_thumb_num2.jpg" border="0" onload="this.className='qlButton'" onmouseover="this.className='qlOn'" onmouseout="this.className='qlButton'" /> </a>
<a href="modal.php" onclick="openMyModal('modal.php'); return false;">
<img onload="this.className='qlWayLo'" onmouseover="this.className='qlWayHi'" onclick="this.className='qlWayHi'" onmouseout="this.className='qlWayLo'" src="images/QuickViewButton.png" border="0"/> </a> </td>
</tr>
</table>
<!---end single thumb box--> </td>
<td valign="middle" align="center">
<!---begin single thumb box-->
<table width="136" border="0" cellspacing="0" cellpadding="0" class="fourColRowPad">
<tr>
<td height="136" width="136" align="center">
<a href="detail_vertical.php">
<img src="images/fpo_thumb_num2.jpg" border="0" onload="this.className='qlButton'" onmouseover="this.className='qlOn'" onmouseout="this.className='qlButton'" /> </a>
<a href="modal.php" onclick="openMyModal('modal.php'); return false;">
<img onload="this.className='qlWayLo'" onmouseover="this.className='qlWayHi'" onclick="this.className='qlWayHi'" onmouseout="this.className='qlWayLo'" src="images/QuickViewButton.png" border="0"/> </a> </td>
</tr>
</table>
<!---end single thumb box--> </td>
</tr>
<!---end 4 column row-->
<!---begin 4 column row-->
<!---end 4 column row-->
<!---begin 4 column row-->
<!---end 4 column row-->
</table>
/*BEGIN THUMB/QUICKVIEW MOUSEOVER*/
.thumbWrap{background:#00FFFF; text-align:center; style="width:136px; height:140px;zoom:1;"}
.qlOn{/*this is the thumb mouseover*/
z-index:1;
position:relative;
left:0px;
top:20px;
border:#b81652 4px solid;
/*margin:10px 5px 0 5px;*/
background:#fff;
zoom:1;
}
/*.qlOnLoad{ z-index:3;position:relative;top:20px;}*/
.qlButton{ z-index:6; /*this is the thumb onload, mouseout*/
position:relative;
left:0px;
top:20px;
/*margin:10px 5px 0 5px;*/
background:#fff;
border:#fff 4px solid;
zoom:1;
}
Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.
Have a better answer? Share it in a comment.
From novice to tech pro — start learning today.
.fourColRowPad{height:200p
Open in new window