PDA

View Full Version : Animated Collapsible DIV - Expand from baseline?



Kempison
06-16-2008, 04:57 PM
1) Script Title: Animated Collapsible DIV v2.01

2) Script URL (on DD): http://www.dynamicdrive.com/dynamicindex17/animatedcollapse.htm

3) Describe problem: Instead of down from the top, how can I get this function to expand up from the baseline of the my table?

If I have content at x pixels in height, it needs to fit in the page, removing the need to scroll to see it all (assume the contents are not to exceed 600 pixels so it can fit on any screen). Example table below:


<!-- Image 01 -->
<table class="ItemTable" cellspacing="0" bgColor="#C2B0AC" onMouseOver="RowOn(this)" onMouseOut="RowOff(this)" onClick="javascript:animatedcollapse.toggle('001')">
<tr>
<td class="ItemName">Hands</td>
<td class="ItemNumber">01</td>
<td class="ItemCnrTL"><img src="images/CnrTL.png"></td>
<td width="532"></td>
<td class="ItemCnrTR"><img src="images/CnrTR.png"></td>
</tr>
<!-- Hidden content starts -->
<tr>
<td class="ItemHidden" colspan="5"><div id="001">***CONTENT GOES HERE***</div></td>
</tr>
<!-- Hidden content ends -->
<tr>
<td class="ItemName"></td>
<td class="ItemNumber"></td>
<td class="ItemCnrBL"><img src="images/CnrBL.png"></td>
<td></td>
<td class="ItemCnrBR"><img src="images/CnrBR.png"></td>
</tr>
</table>

I have searched in vain but am not sure how the function could be defined.

Any help/advice greatly appreciated.

Cheers.

ddadmin
06-17-2008, 03:47 AM
Hmm this has been asked before. To be honest I'm not sure it's even possible. In CSS, expanding the height of an element causes it to push down the content beneath it; as far as I'm aware there's no way to have it push up the content above it instead.

Kempison
06-17-2008, 08:34 AM
Cheers for replying so quickly. It was as much as I expected. I wasn't aware of any CSS that could perform this either. I've another angle to explore. I hope JavaScript may be the tool.

I've clicked a table row and it's expanded down, below the base of the window. Is there any way/any script action of getting the expanded table to be forcibly shown in the window? The action I'm thinking of says to a browser that when the table height is expanded display all of it. Maybe putting something in the bottom <TR> to ensure it floats into view. I dunno.

I really haven't the knowledge to even approach any script writing, but if I find anything I can *******ise, I'll post it as follow-up progress.

Cheers.

Kempison
06-17-2008, 08:37 AM
Apologies, I didn't realise the deleted word was illegal in international English. It's quite colloquial in the UK.