Show/Hide Div Flickering in IE8.0
My working code is attached here.
Problem: When i click hide , the content will be hide from screen with flickering again when i click show , the content will be displayed without flickering.
How do i avoid the flickering when i click hide ?
<table width="60%" cellpadding="1" cellspacing="1" align="center">
<Tr><td align="right"><span class="arrow">»</span><a href="#" onClick="showSlidingDiv(1); return false;">Show</a>
<span class="arrow">»</span><a href="#" onClick="showSlidingDiv(0); return false;">hide</a></td></tr>
</table>
<div id="slidingDiv" style="height:120;display:block;overflow:hidden;">
<table width="60%" cellpadding="3" cellspacing="1" align="center">
<tr>
<th >Upload Type</th>
<th>Month</th>
<th >Total</th>
</tr>
<tr>
<th>Apr</th>
</tr>
<tr class='row2'><td>First Cut</td>
<td valign='top' align='right'>1126</td>
</tr>
</table>
</div>
<div id="dtbl" style="display:block;overflow:hidden;">
<table width="60%" cellpadding="5" cellspacing="1" align="center" class="pop">
<tr><th colspan="2">Test Heading</td></tr>
<tr><Td class="value"><li class="new">Test Info</li></td></tr>
</div>
<script type="text/javascript">
function showSlidingDiv(tval){
if(tval==0)
$("#slidingDiv").hide('slow');
else
$("#slidingDiv").show('slow');
}
</script>