Sent by Lars Holst on 12 February 2003 10:10
Hi Stephen,
Many thanks for the detailed feedback and kind words!
The interesting thing is that I can't reproduce the IE5.2/Mac quirks in any
of the browsers I'm testing in (IE6, O7, Moz1.3a all on W2k). In neither of
these do the topnavigation bar links interfere with each other in their
:hover states, regardless of window size (the bar linewraps at narrow
widths) nor does any flickering occur.
What I do know is that I don't fully understand how major browsers interpret
links, and link paddings, margins, etc. It seems very inconsistent if you
ask me. As an example (I posted a question about this previuosly but got no
answers) Moz treats the entire width of the dropdown submenu row as a link,
while IE6/Win only makes the actual word clickable. Confusing. Mix this with
margins and paddings and quirks seem inevitable.
>None of these are show-stoppers, as far as I'm concerned. IE5/Mac's
>problems are all (a) cosmetic, and (b) minor. Safari's bugs are more
>serious, but (a) they only occur at unusually small window widths
>(given that this is not a handheld browser or anything), (b) Safari is
>likely to be a ridiculously small proportion of your visitors, and (c),
>it's still in beta (I've filed a bug against its rendering of your
>page, too).
Thanks for doing all the hard work for me! I agree with the non-show-stopper
assertion, but I would feel more comfortable knowing what triggers these
quirks, at least in IE5.2/Mac. Safari, as you say, is still in Beta and
should produce results that are consistent with other standards compliant
browsers such as Moz when ready, lest I'm totally missing the point of
putting an entirely new browser on the market?
>I haven't debugged the source of any of these problems yet, but I'll
>try to do so in a few days (I'm in the middle of at least two major
>projects, and my boss would probably frown on my spending several hours
>debugging another site ;-)
I couldn't possibly ask for more. In fact I would ask you to wait with any
furtherdebugging. The feedback I got along with the fact that the
dropdowns/expandable menus don't work in Opera made me search for even
better alternatives than Dave Lindquist's menus (http://www.gazingus.org).
Yesterday I did find what seems to be a slightly better way of accomplishing
the same thing. Have a look at:
AqLists: Unobtrusive DHTML, and the power of unordered lists:
http://www.kryogenix.org/code/browser/aqlists/
What I like about this approach is that it requires minimal changes to the
basic list markup. Take an unordered list and apply a class to it, and
that's it. And it works in Opera. I'm currently in the tweaking phase (not
going well) and if possible would like to get back to you and the list once
I get it working. One drawback seems to be that every link in the navigation
bar must have a dropdown, but hopefully there should be a css-way of getting
around this.
If anyone has tried or tweaked the aqdd menus please share your experiences.
Again, thanks,
Lars
Stephen's comments:
IE5.2/Mac OS X:
(1) The highlighting for the Svenska/English link in the top
navigation bar extends too far to the left in the hover
state (the background covers up part of the word
"Contact").
[...]
The width of the highlighting area seems
to depend on the window width (i.e. wider windows
produce wider highlights, and more of the "Contact"
link is covered up). Additionally, if you move the
cursor directly from "Contact" to "Svenska", the
background of the "Contact" link isn't erased in the
area covered by the artificially widened "Svenska"
link.
(2) There is a bit of a flicker when you move from one
.actuator link to another (the wrong link highlights).
This occurs only in English, as far as I can tell,
and further, it only occurs for links on the same
line as "Svenska", which makes me think that the
two errors are related. Basically, when you move
the cursor between two links such as "News" and
"Links", the link to the right of the pair ("Contact")
highlights. It looks to me like the target area for
the right neighbor link is extending too far, and
marking the space between the two links as
active. This actually appears to be related to the
width of the highlighting for the "Svenska" link--if
the right list box of a pair is wider than the
"Svenska" box, then the right neighbor link is
not highlighted; otherwise, it is.
(3) The page width is greater than the window width,
although the visible content all fits in the window
(so a horizontal scroll bar appears, though it isn't
needed)
Safari/Mac OS X:
(1) When the window width goes below 522 pixels
(or thereabouts), the page width suddenly
increases, and a horizontal scrollbar appears.
Unlike case 3 for IE5, above, however, this is
window width dependent, and also, the scrollbar
is actually needed in this case: when the column
becomes narrower than the floated image (plus
padding), the paragraphs that wrap around that
image ("Our mission is to contribute...", and the
paragraphs after it) suddenly stop respecting
the width restrictions, and each get put onto a
single (very wide) line.
(2) When 1 occurs, the links in the right sidebar
become unusable (probably because they are
"covered" by the other column).
