Martin Chen wrote:
[color=blue]
> Thanks so much for your reply.[/color]
You're welcome.
[color=blue]
> As was so painfully, with the emphasis on pain, obvious to you, I don't do
> web design/coding for a living so I have some more dumb questions w/r to
> your response. I guess my code is a great example of having just enough
> knowledge to be dangerous.[/color]
Correct. But you are free to learn :)
[color=blue]
> 1) Is the code you gave compatiable with both IE6 and FireFox?[/color]
Yes, it is. It will work in _all_ HTML user agents that properly
implement this part of W3C DOM Level 2 Core, HTML and Styles.
[color=blue]
> I've heard they use different DOMs.[/color]
They do. IE has its DOM and Firefox has the Gecko DOM, where both a
proprietary. However these DOMs implement some important features of
the standard W3C DOM (in IE/Win from v5.0 on).
[color=blue]
> Anything I should particularly avoid to avoid compatability issues?[/color]
Do not use any DOM feature, particularly methods, without feature-testing
it before on run-time.
<URL:http://www.pointedears.de/scripts/test/whatami>
[color=blue]
> 2) What I meant by "Does not work" (point taken) was that from what I can
> tell none of the code in my javascript mouse handlers seems to execute in
> Firefox (but does in IE6) unless I reload the page (of contents frame).[/color]
So, did you read and follow the FAQ on debugging? No error messages at all?
[color=blue]
> Specifically, when the mouse passes over the menu item, the text should
> change from white to yellow and the background get slightly lighter and
> the reverse when the mouse leaves.[/color]
That much was clear.
[color=blue]
> If your interested, here's the URL
> (start with www end with com) interspersed with extra "z"s to avoid nasty
> bots. .EnzVisionzSystemsLzLC.[/color]
Am I supposed to solve that riddle to see the code? You bet I am not.
At least now, you would like to have something from your readers. Making
helping you more difficult is not going to help you.
[color=blue]
> Will the code below that solve this problem?[/color]
My code is intended to solve that problem, otherwise I would not have posted
it.
[color=blue]
> How? (Just curious)[/color]
| function mouseHandler(id, bMoveIn)
| {
| var o;
| if (isMethodType(typeof document.getElementById)
| && (o = document.getElementById(id)))
| {
| setStyleProperty(o, 'backgroundColor',
| bMoveIn ? '#369' : '#36f');
|
| setStyleProperty(o, 'color',
| bMoveIn ? '#ff0' : '#fff');
| }
| }
| [...]
| onmouseover="mouseHandler('choice1', true)"
| onmouseout="mouseHandler('choice1', false)"
The mouseHandler() method does what both the previous movein() and moveout()
methods attempted to do. To distinguish between the events, it is passed
`true' as second, previously _unused_, argument when the `mouseover' event
occurs and `false' (which could be left out) if the `mouseout' event
occurs.
The method is passed the ID of the target element as first argument.
Within the method, it is tested [through the user-defined method
isMethodType()] whether document.getElementById() is supported by
the UA's DOM and if so, it is called with the value of the first
method argument (id) as argument. If successful, an object reference
is returned that is assigned to the local variable `o'; since that
expression is within a boolean expression, it is automatically
type-converted: a valid object reference always returns to `true'.
The `if' expression evaluates to `true' (because the previous feature
test returned `true' as well and the operator is `&&') and the
adjacent block is evaluated. The user-defined setStyleProperty()
method is called two times to set style properties of the element
object referred to if supported (`typeof ... != "undefined"'). The
new value of those properties is defined by the value of the second
argument of mouseHandler() [see above].
Reviewing this, there is a much better approach because
1. The target element is the element that fired the event.
2. The event type can be retrieved from the value of the
`type' property of the `event' object, whether that
being global or context-sensitive.
Therefore:
function mouseHandler(o, e)
{
var bMoveIn = (e.type == "mouseover");
setStyleProperty(o, 'backgroundColor',
bMoveIn ? '#369' : '#36f');
setStyleProperty(o, 'color',
bMoveIn ? '#ff0' : '#fff');
}
[...]
onmouseover="mouseHandler(this, event);"
onmouseout="mouseHandler(this, event);"
And there is an additional CSS alternative for conforming user agents
where client-side script support is not present:
#choice1 {
background-color:#36f;
color:#fff;
}
#choice1:hover {
background-color:#369;
color:#ff0;
}
(Replace `#choice' with `td' for this to apply to all `td' elements,
then you would not need IDs in the HTML code anymore.)
That said, using event handler attribute values for `td' elements to
facilitate some kind of menu is clearly a Bad Thing (cannot be said
too often). The menu should be realized through a[href] elements
that are children of `li' elements that are children of formatted `ul'
elements. The `target' attribute of a[href] elements should be used
where necessary to access different frames; however, generally, frames
should be used only when really needed, i.e. they should be avoided
whenever and whereever viable.
[color=blue]
> 3) I see below 3 hex color codes rather than the 6 ones I'm familiar with
> (e.g. which.style.color = '#ff0') what does that mean?[/color]
This color value, which is valid CSS and CSS only, is
independent of the color depth of the readers's display.
<URL:http://www.w3.org/TR/CSS2/syndata.html#value-def-color>
Additionally, I coined the term True Web-Safe Colors to specify color values
that are very unlikely to result in dithering or palette correction down to
a color depth of 8 bit. Those are hex triplets #hhh with each component
being only one of the values `0', `3', ..., `c' and `f', essentially
resulting in the previous 216-colors Netscape Safe-Browser color palette
with the additional property of being independent of color depth, hence
adhering fully to accessibility guidelines, proper foreground-background
contrast provided.
[color=blue]
> 4) You wrote[color=green]
>> setStyleProperty(o, 'backgroundColor',
>> bMoveIn ? '#4376A9' : '#369' : '#36f');[/color]
> I understand (<boolexp> : <truechoice> : <falsechoice>) but there's an
> extra
> colon that I can't parse. I guess this is also an example of the 3 hex
> long color thing that I don't understand.[/color]
No, it is a typo that I corrected in
news:1199741.fa7FEZeTJ1@PointedEars.de :)
[color=blue]
> 5) You commented on my bad choice of colors; that they arent' web safe.
> When I chose those colors, I did so on an educated guess that the concept
> of web-safe colors was from a time when lots of poeple ran 16 or 256 color
> graphic cards and so non-web-safe colors were dithered or god knows what .[/color]
They may be still dithered or adjusted to the available color palette,
even with 16-bit color depth (HiColor). With #hhhhhh, you are assuming
TrueColor (24+ bits).
[color=blue]
> However, the type of person who would look at my web site would be running
> at least 16bit color depth.[/color]
How can you be so sure? (Do you not want visitors with less color depth?)
[color=blue]
> So, I figured it wouldn't matter if my colors weren't traditional
> web-safe. Is that reasonable or am I being to cavalier?[/color]
You do not take mobile devices for accessing the Web into account,
for example.
[color=blue]
> 6) So what is the "standard" for web page authoring technology these days
> (e.g. CSS, DHTML but not frames etc etc etc). I'd like to know for future
> reference which technologies to avoid. (I guess I'll redo my web site
> some sunny day when it bubbles up to a priority)[/color]
As that is a general question, it is better to be asked in the appropriate
newsgroup: comp.infosystems.
www.authoring.misc
[color=blue]
> 7) For future reference: Do you have any recommendation for reasonably
> priced properly done Web page software package? As you know I'm running
> FP 2K but I'm really augmenting it by hand these days. I take it for
> granted that anything produced by MS will have compatability issues. I
> don't author web pages for a living so spending lots of money and time
> probably isn't in the cards.[/color]
That is quite off-topic here, too. However, it is my conviction that using
any development software without basic knowledge about the techniques it
provides, will inevitably result in bad code. FP is no exception of this;
there are _professionals_ that are able to do valid, interoperable code
with that application. Yet, also because I am working on GNU/Linux where
there is no FP available, I prefer plain-text editors with additional
features such as syntax highlighting and code completion, especially I
am using and recommending eclipse (currently 3.2) with several editor
plugins like PHPeclipse, MyEclipse (currently 4.1M1) and several (other)
JavaScript editor plugins.
[color=blue]
> My questions reply interspersed below:
> "Thomas 'PointedEars' Lahn" <PointedEars@web.de> wrote in message
> news:4209935.CaaZ2Cfm2s@PointedEars.de...[color=green]
>> Martin Chen wrote:
>> [Full quote][/color][/color]
DO NOT top-post on Usenet.
<URL:http://jibbering.com/faq/faq_notes/pots1.html>
PointedEars
