Simply show hide div Using css.. a popdiv visible when hover on download link same with other links. but in ie7 there is some Z-index problem
My code is below (please be kind, I know I'm not very good at this), any help is appreciated.
`<table width="100%" border="0" cellspacing="0" cellpadding="0" class="product_resulttable">
<tr>
<td><div class="imgbox"></div></td>
<td>DMC-ZS19K<br />
Manual pics</td>
<td>03 Oct,2012</td>
<td>25,500</td>
<td><div class="actionlist">
<ul class="dott">
<li><a href="#">Download</a>
<div class="popup_div">
first block
</div>
</li>
<li><a href="#">Add to Basket</a>
<div class="popup_div">
second block
</div>
</li>
<li><a href="#">Share</a></li>
</ul>
</div></td>
</tr>
</table>`
css:
.actionlist { background:#e6eaf6; border:1px solid #d9e0f4; border-radius:5px; width:132px; padding:8px 0 }
.dott { list-style:none; background:yellow }
.dott li { display:block;position:relative }
.dott li a { display:block; padding:2px 9px; color:#454545; font-size:11px; }
.popup_div{position:absolute; z-index:9999; background:#f5f6fb; width:140px; border:1px solid #c2d0eb; min-height:140px; left:-5px; display:none }
div.actionlist ul li:hover > div.popup_div { display:block; }
here is jsfiddle link: http://jsfiddle.net/hjx5y/12/