Simple script works in Firefox but not IE7

04-28-2009

Hi -

I am trying to write some Javascript that will move both buttons
and selects from far left of the viewport into and out of the
viewport. I present a button that moves in another button. The second
button moves in a select.

All of this works in Firefox. Moving the button in and out works
in IE7, but moving in the select does not, despite the exact same code
being used in both cases. The code is below. Note that I added the
"min-height: 0" style statement to the style because I thought that
this might be a Microsoft "layout" problem, but setting min-height
did not affect the problem.

Any help appreciated;

Garey Mills

<html>
<head>
<style type="text/css">

div.extraout { position: absolute; left: -9999em; min-height: 0 }

</style>

<script language="JavaScript">

function ucbmoveIn(name) {

var elem = document.getElementById(name);
elem.style.position = "static";

}

function ucbmoveOut(name) {

var elem = document.getElementById(name);
elem.style.position = "absolute";

}

</script>
</head>

<body>

<button name="more" value="more" onClick='ucbmoveIn("l");return
false;'>More</button>

<div class="extraout" id="l">
<table>
<tr>
<td><button name="a" value="a" onClick='ucbmoveIn("a");return
false;'>A</button></td>
</tr>
</table>
<button name="less" value="less" onClick='ucbmoveOut("l");return
false;'>Hide</button>
</div>

<div class="extraout" id="a">
<tr><td>As</td><td>

<select name="lA" id="lA" size="10" multiple="multiple">
<option value="ach">acholi</option>
<option value="ada">adangme</option>
<option value="afh">afrihili</option>
</select>
</td></tr></table>
<button name="hideAs" value="hideAs" onClick='ucbmoveOut("a");return
false;'>Hide</button>
</div>

</body>
</html>

04-29-2009

garey wrote:
> I am trying to write some Javascript that will move both buttons
> and selects from far left of the viewport into and out of the
> viewport. I present a button that moves in another button. The second
> button moves in a select.
>
> All of this works in Firefox. Moving the button in and out works
> in IE7, but moving in the select does not, despite the exact same code
> being used in both cases. The code is below. Note that I added the
> "min-height: 0" style statement to the style because I thought that
> this might be a Microsoft "layout" problem, but setting min-height
> did not affect the problem.
>
> Any help appreciated;
>
> Garey Mills
>
> <html>

Not Valid.

> <head>
> <style type="text/css">
>
> div.extraout { position: absolute; left: -9999em; min-height: 0 }

Smart people hide the element instead of placing it in CSS hell.

> </style>
>
> <script language="JavaScript">

Not Valid. HTML 4.01 and the `type' attribute turn 10 years this December;
amazing how long such obsolete nonsense as above keeps floating around the Web.

<http://validator.w3.org/>

> function ucbmoveIn(name) {
>
> var elem = document.getElementById(name);

The feature test is missing. RTFM, RTFFAQ, STFW.

> elem.style.position = "static";

"static" is the default value. Had you not mindlessly moved the element
beyond good and evil in the first place, that operation would have been
unnecessary.

>
> }
>
> function ucbmoveOut(name) {
>
> var elem = document.getElementById(name);

See above.

> elem.style.position = "absolute";

No.

> }
>
> </script>
> </head>
>
> <body>
>
> <button name="more" value="more" onClick='ucbmoveIn("l");return
> false;'>More</button>

The less compatible `button' element is unnecessary here, a (dynamically
generated) input[type="button"] suffices.

> <div class="extraout" id="l">

Very self-explaining ID, really.

> <table>
> <tr>
> <td><button name="a" value="a" onClick='ucbmoveIn("a");return
> false;'>A</button></td>

See above.

> </tr>
> </table>

You don't need this table at all. Learn HTML and CSS before you try to
learn JS.

> <button name="less" value="less" onClick='ucbmoveOut("l");return
> false;'>Hide</button>

See above. Forget about `return false'; use type="button" instead and
generate this dynamically. (Did anyone tell you already that you should
learn HTML before you try to learn JS?)

> </div>
>
> <div class="extraout" id="a">

See above.

> <tr><td>As</td><td>

Not Valid. There is no table for this table row as the one table in the
document ended well before this line.

> <select name="lA" id="lA" size="10" multiple="multiple">

See above. Besides, this isn't XHTML, is it? HTML UAs tend to choke on
this boolean syntax, even though SGML allows it. RTFM.

> [...]
> </td></tr></table>
> <button name="hideAs" value="hideAs" onClick='ucbmoveOut("a");return
> false;'>Hide</button>

See above.

PointedEars

04-30-2009

Thomas 'PointedEars' Lahn <> writes:

>> <select name="lA" id="lA" size="10" multiple="multiple">
>
> See above. Besides, this isn't XHTML, is it?

Why would that matter?

> HTML UAs tend to choke on this

That’s a nice bunch of weasel words.

> boolean syntax,

Come again?

> even though SGML allows it.

I withdraw my first question.

You seem to know that HTML UAs don’t have any SGML capabilities. Please
explain all those URI references to the W3C validation service to
confirm compliance with a validating SGML system.

> RTFM.

Or STFW if you are too cheap to buy the manual that actually matters if
you want to discuss esoterica.

04-30-2009

Eric Bednarz wrote:
> Thomas 'PointedEars' Lahn <> writes:
>>> <select name="lA" id="lA" size="10" multiple="multiple">
>> See above. Besides, this isn't XHTML, is it?
>
> Why would that matter?

In XHTML this is required; in HTML this is recommended against.

>> HTML UAs tend to choke on this
>
> That’s a nice bunch of weasel words.
>
>> boolean syntax,
>
> Come again?
>
>> even though SGML allows it.
>
> I withdraw my first question.
>
> You seem to know that HTML UAs don’t have any SGML capabilities. Please
> explain all those URI references to the W3C validation service to
> confirm compliance with a validating SGML system.
>
>> RTFM.
>
> Or STFW if you are too cheap to buy the manual that actually matters if
> you want to discuss esoterica.

Idiot. <http://www.w3.org/TR/html401/appendix/notes.html#h-B.3.4>

<http://jibbering.com/faq/#posting>
<http://www.catb.org/~esr/faqs/smart-questions.html#before>

PointedEars

04-30-2009

kangax wrote:
> Thomas 'PointedEars' Lahn wrote:
>> garey wrote:
>>> div.extraout { position: absolute; left: -9999em; min-height: 0 }
>> Smart people hide the element instead of placing it in CSS hell.
>
> CSS hell? Please explain another way to "hide" an element in such way
> that its content is "picked up" and pronounced by screen readers.

No, because the whole thing is not accessible in the first place.

PointedEars

04-30-2009

On Apr 30, 8:53*am, kangax <kan...@gmail.com> wrote:
> Thomas 'PointedEars' Lahn wrote:
> > garey wrote:
> [...]
> >> div.extraout { position: absolute; left: -9999em; min-height: 0 }
>
> > Smart people hide the element instead of placing it in CSS hell.
>
> CSS hell? Please explain another way to "hide" an element in such way
> that its content is "picked up" and pronounced by screen readers.

If an element is hidden, you don't want it to be read by screen
readers. If it is not hidden, you certainly don't want to place it
off-screen so that only blind people will be aware of it.

04-30-2009

On Apr 30, 12:47*pm, kangax <kan...@gmail.com> wrote:
> David Mark wrote:
> > On Apr 30, 8:53 am, kangax <kan...@gmail.com> wrote:
> >> Thomas 'PointedEars' Lahn wrote:
> >>> garey wrote:
> >> [...]
> >>>> div.extraout { position: absolute; left: -9999em; min-height: 0 }
> >>> Smart people hide the element instead of placing it in CSS hell.
> >> CSS hell? Please explain another way to "hide" an element in such way
> >> that its content is "picked up" and pronounced by screen readers.
>
> > If an element is hidden, you don't want it to be read by screen
> > readers. *If it is not hidden, you certainly don't want to place it
> > off-screen so that only blind people will be aware of it.
>
> Most of the time not. But there are cases when information can be
> perceived fully only visually and some additional content/explanation
> needs to be presented to a screen reader. These cases are rare but they
> do come up once in a while.

Sure, there are exceptions. I've seen that strategy advocated as a
replacement for hidden visibility though, which it clearly is not.

>
> I suppose this article explains it best (and features actual examples):
>
> <http://www.webaim.org/techniques/css/invisiblecontent/>

No time at the moment, but beware of anything you find on the Web.
Just as with JS, there are lots of people expressing lots of ideas
about how to use CSS on the Web (and most of them are wrong.)

>
> --
> kangax

05-01-2009

On Apr 30, 8:13*pm, kangax <kan...@gmail.com> wrote:
> David Mark wrote:
> > On Apr 30, 12:47 pm, kangax <kan...@gmail.com> wrote:
> [...]
> >> I suppose this article explains it best (and features actual examples):
>
> >> <http://www.webaim.org/techniques/css/invisiblecontent/>
>
> > No time at the moment, but beware of anything you find on the Web.
> > Just as with JS, there are lots of people expressing lots of ideas
> > about how to use CSS on the Web (and most of them are wrong.)
>
> That's true; There's plenty of bizarre explanations and workarounds
> floating around. WebAIM, on the other hand, is a quite respected
> resource, as far as I know. If you have any objections to the material
> from that article, I would be interested to hear them.

I'll check it out when I get a chance.

>
> On a side note, it would be nice if the information one can find in this
> newsgroup would get more attention on the web. Cornford's and

More is always better when it comes to attention. Lots of
misconceptions to clear up at this point.

> Crockford's articles are good examples of spreading some of the
> browser-scripting (or language, overall) techniques, as well as Peter
> Michaux's blog (I think one of his feature detection -related articles
> is how I found out about comp.lang.javascript in the first place).
>
> Some time ago, I made a naive attempt at releasing a set of examples of
> some of the common feature tests one might stumble upon. The funny thing
> is that when it got to Ajaxian, some people actually argued about
> sniffing being "faster" and supposedly more superior.

Ajaxian is a rag. And that must have been some time ago as I don't
think anyone would argue for browser sniffing at this point.

05-01-2009

Thomas 'PointedEars' Lahn <> writes:

[multiple="multiple"]

>>> RTFM.
>>
>> Or STFW if you are too cheap to buy the manual that actually matters if
>> you want to discuss esoterica.
>
> Idiot.

You are a pompous wannabe-hacker permanently stuck in adolescence.

> <http://www.w3.org/TR/html401/appendix/notes.html#h-B.3.4>

If you wanna be pragmatic, the HTML 4.01 spec is ten years old, that
section was already in the first HTML 4 spec that is eleven years old,
and if you consider WG speed it is likely that this note is about the
browser landscape twelve years ago or older. So this is supposed to back
up your statement “HTML UAs tend to choke on this”?

If you wanna be dogmatic, there are no ‘boolean attributes’ in
SGML. There’s attribute name omission for name token lists, and
historically that was *the* reason to enable SHORTTAG in the quixotic
attempt to retrofit HTML into an SGML application.
So where’s the appendix note that explains how ‘boolean attributes’
enable notation like
<td justify>
?

05-01-2009

Eric Bednarz wrote:
> Thomas 'PointedEars' Lahn <> writes:
> [multiple="multiple"]
>>>> RTFM.
>>> Or STFW if you are too cheap to buy the manual that actually matters if
>>> you want to discuss esoterica.
>> Idiot.
>
> You are a pompous wannabe-hacker permanently stuck in adolescence.

At least I'm not such a luser like you. I've given (you) enough hints on
where to find the relevant information, yet you've been either unable or
unwilling to look it up, and instead engage in pointless quibbling over
words without even trying to back up *your* assertions.

>> <http://www.w3.org/TR/html401/appendix/notes.html#h-B.3.4>
>
> If you wanna be pragmatic, the HTML 4.01 spec is ten years old, that
> section was already in the first HTML 4 spec that is eleven years old,
> and if you consider WG speed it is likely that this note is about the
> browser landscape twelve years ago or older. So this is supposed to back
> up your statement “HTML UAs tend to choke on this”?

Unless someone can provide sufficient proof to the contrary. Which nobody
can, of course.

> If you wanna be dogmatic, there are no ‘boolean attributes’ in
> SGML. There’s attribute name omission for name token lists, and
> historically that was *the* reason to enable SHORTTAG in the quixotic
> attempt to retrofit HTML into an SGML application.

Interesting if true, but entirely irrelevant here. Following the HTML 4.01
Specification, Appendix B, section 3.4, has only potential advantages and no
drawbacks.

> So where’s the appendix note that explains how ‘boolean attributes’
> enable notation like
> <td justify>
> ?

Hush, hush, baby.

PointedEars

Similar Threads
Thread	Thread Starter	Forum	Replies	Last Post
Windows Authentication in IIS7 works in FireFox but not in IE7/8	APA	ASP .Net	0	01-11-2010 11:31 PM
Script works in Firefox and Chrome, but not in IE7	garey	Javascript	1	04-29-2009 11:10 PM
simple script inserted in websurvey software works in firefox but not in internet explorer	gray_slp	Javascript	3	06-27-2007 02:56 AM
what's wrong with this iframe? (works in Firefox, but not IE7)	Aidan	HTML	4	06-07-2007 06:09 AM
AJAX works in IE6 but not IE7 or Firefox	Steve Wright	Javascript	5	03-15-2007 06:03 PM