revealing content

[Michael Hill]

If I have a div set as follows:

<div id="div_1" style="position:absolute; z-index:1; left:33px;
top:177px; height:20px; width:910px; visibility:visible;
overflow:hidden; border:1px solid red;">alot of content here that varies
in length</div>

and trying to incrementally reveal the content using the following
javascript until the height is equal to "222"

function extend()
{
var obj = document.getElementById('div_1')
var amt = "222";
setTimeout(int_a, 100);
function int_a()
{
var currH = obj.style.height
var currHS = currH.split("px")
if ( parseInt(currHS) < amt )
{
var newH = (parseInt(currHS)+1) + "px"
obj.style.height = newH
setTimeout(int_a, 50);
}
}
}

How to I make a change to reveal the content until all the content is
revealed instead of harcoding a value like I have done above?

Mike

 

[Richard Cornford]

If I have a div set as follows:

<div id="div_1" style="position:absolute; z-index:1; left:33px;
top:177px; height:20px; width:910px; visibility:visible;
overflow:hidden; border:1px solid red;">alot of content here
that varies in length</div>

and trying to incrementally reveal the content using the
following javascript until the height is equal to "222"

function extend()
{
var obj = document.getElementById('div_1')
var amt = "222";
setTimeout(int_a, 100);
function int_a()
{
var currH = obj.style.height
var currHS = currH.split("px")
if ( parseInt(currHS) < amt )

String.prototype.split should return an Array, which, when passed to
parseInt, will be converted to a String and then parsed into a number.
Quite an inefficient way of trimming the final "px" from the
style.height value. parseInt stops attempting to interpret its input as
a number when it encounters a character that cannot be a numeric digit
in the radix specified (or not as the second argument is optional, but
advisable) (except when interpreting hex as a leading 0x would be
acceptable as signifying a hex number).

How to I make a change to reveal the content until all the content is
revealed instead of harcoding a value like I have done above?

Nesting elements. You put the contents in another positioned DIV inside
the first but you do not constrain its height dimension. Then reading
the height of the inner DIV will tell you the maximum value needed to
fully reveal it in the outer DIV. You would probably read the height
from the - offsetHeight - property of the DIV element, baring in mind
that some browsers do not impediment any element dimension reporting
properties (requiring sensible planned clean degradation for those
cases).

Richard.

 

[Michael Hill]

function int_a()

String.prototype.split should return an Array, which, when passed to
parseInt, will be converted to a String and then parsed into a number.
Quite an inefficient way of trimming the final "px" from the
style.height value. parseInt stops attempting to interpret its input as
a number when it encounters a character that cannot be a numeric digit
in the radix specified (or not as the second argument is optional, but
advisable) (except when interpreting hex as a leading 0x would be
acceptable as signifying a hex number).

Richard how would you do this?