What is the right way to use "height:expression(eval(...));"

Do you have a question? Post it now! No Registration Necessary.  Now with pictures!

Threaded View

This question was asked in comp.lang.javascript with no result.

In IE5.x and IE6, I want to display an image when the user rolls over a
text link. The image does indeed display, but only on the first
rollover. It seems that the image height and width become set to zero
after the image is displayed once; or perhaps that the
height:expression(eval(...)); code is executed only once for each page

problem demo:


Can some kind soul tell what I need to do to get the image to show up?

-- fredo

Re: What is the right way to use "height:expression(eval(...));"

Aaagghhhh! I misstated the problem. I wrote before:

Quoted text here. Click to load it

The REAL problem is this: I need to take the lesser value of (the
intrinsic/auto height of an image) and (100% of the viewport height)
and display an image using that value as the height of the image. The
code is:

// by "this.Height", I mean the intrinsic height of the image I'm
trying to display

height:expression(eval(this.Height <

  (document.documentElement.clientHeight!='undefined' ?
   document.documentElement.clientHeight :
  document.body.clientHeight) ?

 this.Height :

  (document.documentElement.clientHeight!='undefined' ?
  document.documentElement.clientHeight :
  document.body.clientHeight)-50 ));

But the image is always displayed using its intrinsic height. What is
wrong with the test in my code? Thanks!

-- fredo

Re: What is the right way to use "height:expression(eval(...));"

fredo wrote:

Quoted text here. Click to load it

I'm no expert on conditional comments but it looks like you've got some
inverted logic on your conditions. Check me:

<!--[if gte IE 5.0]>
  <![if lt IE 7]>
   [do the fancy tricks, which I did not check]

The first line says If IE 5 or higher. The second line is probably
*supposed* to say If IE lower than v7. But the second line really says
(right?) If NOT IE lower than 7.

! = The NOT operator. This is placed immediately in front of an value or
expression or feature and reverses the Boolean value of the operand.

Also, it looks like  <![endif]> is not really the terminator for the
inner condition, because of the missing dashes, but (1) I'm not sure and
(2) I'm not sure if it'd affect your problem.


Re: What is the right way to use "height:expression(eval(...));"

John Hosking wrote:
Quoted text here. Click to load it

Okay, I see now that the closing eindif is different for NOTted
conditions, so syntactically, the code is correct. Still think the logic
is wrong though.


Re: What is the right way to use "height:expression(eval(...));"

John Hosking wrote:
Quoted text here. Click to load it

No, because the negation goes with the conditional:

  <![if !ltIE7]

and the <! at the front of the conditional statement merely introduces
the production to be parsed.

Quoted text here. Click to load it

It can't have two dashes, because that would look like an HTML comment
terminator, which is not. And cannot be.

Thanks, John. I appreciate your comment and don't at all mean to
terminate it. :-)

-- fredo

Free Website Designing solution.

Welcome to MAX web Solution's Website, a full service affordable
offshore web site design, Search Engine marketing and web development
company based in Kathmandu. We focus on e business solutions at low
prices serving the needs of small to medium businesses all over the
world. We offer a wide range of custom web site design development and
seo services at affordable prices starting from small presentation
sites to complex multifunctional web portals and advanced custom
e-commerce business solutions.
Service is everything - your satisfaction is guaranteed
That is why we would gladly accept the responsibility of taking care of
your site. We want to save your time, so that you could devote yourself
to the most important thing - your business. Allow us to maintain and
support your web site.
Money back guarantee
A 30 Day money back guarantee for the first monthly fee.
You can also response to this message.

Fillup the below information for further inquarry.
Contact Name :
Organization Name:
E-mail Address :
Phone no:
Call us for Demostration
Call : 2390177 / 9841206820
Check it out for more information

Re: What is the right way to use "height:expression(eval(...));"

fredo wrote:
Quoted text here. Click to load it

It is difficult to see anything right with your code. First there is -
this.Height -, which evaluates as the - Height - property of the object
referred to by - this -.If - this - reefers to an IMG element's DOM
representation then it would not be expected to have a - Height -
property. The properties of IMG elements that have values corresponding
with the width and height attributes in the HTML mark-up (and may adopt
the dimensions values of the image in some browsers, including IE) are
called 'width' and 'height', with initial lowercase letters. The -
this.Height - reference is likely to evaluate as JScript's Undefined
value, and make a nonsense out of the 'less than' comparison (as it will
always result in what is effectively boolean false).

The call to the - eval - function surrounding the expression is
worthless (and like at least 99.9% of uses of - eval - in
JScritp/javascript code, indicative of an author who has no idea of what
they are doing). If the argument to the - eval - function is not of
string primitive type the - eval - function does nothing, returning its
argument unaltered. Here the argument to - eval - is going to be of
numeric primitive type, or of Undefined Type (though the nonsense that
has been made of the comparison should prevent that). The - eval - call
can be removed form the code with no other adjustments being needed,
making its presence in the code a sure sign that the author did not know
what the -eval - function does, or why it was included in the first

The 'not equal' comparisons (both of them) are also a nonsense. The
comparison is between the value of -
document.documentElement.clientHeight -, which will be numeric on IE
browsers, and the literal string primitive 'undefined'. This mix of
types in the operands is handled by having the operands type-converted
to numeric primitives prior to the comparison and a numeric comparison
performed to determine the boolean result. The string operand,
'undefined', would type-convert to the special numeric value NaN (Not a
Number) as it does not contain a character sequence that can be
interpreted as any number. The numeric NaN value is never equal to any
value, including itself, so the 'not equal' comparisons are always true.


Re: What is the right way to use "height:expression(eval(...));"

fredo wrote:
Quoted text here. Click to load it

And what is it supposed to do in superior browsers such as Mozilla


Re: What is the right way to use "height:expression(eval(...));"

Dan wrote:
Quoted text here. Click to load it

Superior browsers understand and honor max-height. This hack aims to
get around IE lt 7 max-height deficiency. Mozilla, Firefox, and others
need no such hack. To see FF handle max-height perfectly, see:


-- fredo

Site Timeline