I posted over the holidays, but I venture to repost since there were
no responses. Maybe people overlooked my article among all the
excitement.
I'm looking for a template or model for menus that drop down when the
mouse hovers over them. Criteria: must work without JS, even in IE,
must degrade acceptably in non-CSS browsers, must not be sized in
pixels.
Here's what I posted a couple of weeks ago:
For some time now, I've been wanting to improve the look of the menus
at my site http://www.tc3.edu/instruct/sbrown/stat/ . I like way
these two work, opening a submenu when hovering on a selection: http://www.cssplay.co.uk/menus/simple_vertical.html http://www.grc.com/menu2/invitro.htm
They are pure CSS with no JS (even for MSIE 5 and 6). And they
degrade acceptably in a non-CSS browser like Lynx. But both are set
up in pixels -- the second one even uses images instead of text for
the top-level menu.
I've had no luck with Google, and it seems like an awful lot of work
to back-convert all the pixels to ems and fuss with the positioning.
Does anyone know where I can find the Holy Grail of menuing, a setup
that works in IE5(*) through IE7 as well as real browsers, without JS
and without fixed pixel dimensions?
(*) If necessary, I can live without IE5 compatibility.
--
Stan Brown, Oak Road Systems, Tompkins County, New York, USA http://OakRoadSystems.com/
HTML 4.01 spec: http://www.w3.org/TR/html401/
validator: http://validator.w3.org/
CSS 2.1 spec: http://www.w3.org/TR/CSS21/
validator: http://jigsaw.w3.org/css-validator/
Why We Won't Help You: http://diveintomark.org/archives/200..._wont_help_you 14  1697 
Stan Brown wrote:
>
I'm looking for a template or model for menus that drop down when the
mouse hovers over them. Criteria: must work without JS, even in IE,
must degrade acceptably in non-CSS browsers, must not be sized in
pixels.
You might want to look at the Brothercake menu http://www.brothercake.com/dropdown/
--
Berg
"Gregor Kofler" <us****@gregorkofler.atwrote in message
news:7a***************************@news.inode.at.. .
Stan Brown meinte:
>must work without JS, even in IE,
I suppose that's pretty impossible. If you're talking about IE6 or
earlier.
Anyway, "dropdown menus for ie without javascript" gives me 106.000 hits.
Still, I don't think there is a pure-css-and-ie6-too version among them.
Here's one: http://barefile.com.au/cssmenu/
Even supports IE5.5.
--
Richard.
rf wrote:
"Gregor Kofler" <us****@gregorkofler.atwrote in message
news:7a***************************@news.inode.at.. .
>Stan Brown meinte:
>>must work without JS, even in IE,
I suppose that's pretty impossible. If you're talking about IE6 or
earlier.
Anyway, "dropdown menus for ie without javascript" gives me 106.000 hits.
Still, I don't think there is a pure-css-and-ie6-too version among them.
Here's one:
http://barefile.com.au/cssmenu/
Even supports IE5.5.
Richard, that looks very interesting!
Do you have anything written up that explains the techniques you used?
Specifically, examining the HTML/CSS I'm wondering about the structure
of the second and third menu items from the left.
--
Ed Mullen http://edmullen.net http://mozilla.edmullen.net http://abington.edmullen.net
I have no choice but to believe in free will. - Randy Wayne White
"Ed Mullen" <ed@edmullen.netwrote in message
news:hM******************************@comcast.com. ..
rf wrote:
>"Gregor Kofler" <us****@gregorkofler.atwrote in message
news:7a***************************@news.inode.at. ..
>>Stan Brown meinte:
must work without JS, even in IE,
I suppose that's pretty impossible. If you're talking about IE6 or
earlier.
Anyway, "dropdown menus for ie without javascript" gives me 106.000
hits. Still, I don't think there is a pure-css-and-ie6-too version among
them.
Here's one:
http://barefile.com.au/cssmenu/
Even supports IE5.5.
Richard, that looks very interesting!
Do you have anything written up that explains the techniques you used?
Not as yet. I just pulled it out of one of my CMS's in answer to a post a
few weeks ago.
Specifically, examining the HTML/CSS I'm wondering about the structure of
the second and third menu items from the left.
Nothing very dramatic. The sub-menu is in a table, initially hidden and
positioned absolutely in its (relatively positioned) parent. The conditional
comments determine what HTML each browser sees.
Specifically:
<!--[if gt IE 6]><!--></a><!--<![endif]-->
The </awill be seen by IE7 (and above) because of the conditional
comments, and all non-IE browsers who correctly parse away the comments.
This method is explained on Microsofts site, it's kind of a reverse
conditional comment.
<!--[if lte IE 6]></a><![endif]-->
The </ais only seen by IE 6 and below.
As for the menu:
IE6 and below see a <li(the top level item) containing a <a_which
contains the table_. Visibility of the table is controlled by .nav a:hover
table. This is of course invalid HTML but who cares, we are throwing it only
at IE6 and below and they seem quite happy with it.
All other browsers see a <licontaining both a <aand the table, with the
table _following_ the <a>. Visibility of the table is controlled by .nav
li:hover table.
Note there is a bit of fluff in the HTML to allow the CMS to apply differing
effects to the menu.
--
Richard.
rf wrote:
"Ed Mullen" <ed@edmullen.netwrote in message
news:hM******************************@comcast.com. ..
>rf wrote:
>>"Gregor Kofler" <us****@gregorkofler.atwrote in message
news:7a***************************@news.inode.at ...
Stan Brown meinte:
must work without JS, even in IE,
I suppose that's pretty impossible. If you're talking about IE6 or
earlier.
Anyway, "dropdown menus for ie without javascript" gives me 106.000
hits. Still, I don't think there is a pure-css-and-ie6-too version among
them.
Here's one:
http://barefile.com.au/cssmenu/
Even supports IE5.5.
Richard, that looks very interesting!
Do you have anything written up that explains the techniques you used?
Not as yet. I just pulled it out of one of my CMS's in answer to a post a
few weeks ago.
>Specifically, examining the HTML/CSS I'm wondering about the structure of
the second and third menu items from the left.
Nothing very dramatic. The sub-menu is in a table, initially hidden and
positioned absolutely in its (relatively positioned) parent. The conditional
comments determine what HTML each browser sees.
Specifically:
<!--[if gt IE 6]><!--></a><!--<![endif]-->
The </awill be seen by IE7 (and above) because of the conditional
comments, and all non-IE browsers who correctly parse away the comments.
This method is explained on Microsofts site, it's kind of a reverse
conditional comment.
<!--[if lte IE 6]></a><![endif]-->
The </ais only seen by IE 6 and below.
As for the menu:
IE6 and below see a <li(the top level item) containing a <a_which
contains the table_. Visibility of the table is controlled by .nav a:hover
table. This is of course invalid HTML but who cares, we are throwing it only
at IE6 and below and they seem quite happy with it.
All other browsers see a <licontaining both a <aand the table, with the
table _following_ the <a>. Visibility of the table is controlled by .nav
li:hover table.
Note there is a bit of fluff in the HTML to allow the CMS to apply differing
effects to the menu.
Thanks very much. I'll study this later on. I had the same issue as
Stan who posted the original question. This looks like a very promising
solution!
--
Ed Mullen http://edmullen.net http://mozilla.edmullen.net http://abington.edmullen.net
Animal testing is a bad idea - they get nervous and give the wrong answers.
rf wrote:
"Ed Mullen" <ed@edmullen.netwrote in message
news:hM******************************@comcast.com. ..
>rf wrote:
>>"Gregor Kofler" <us****@gregorkofler.atwrote in message
news:7a***************************@news.inode.at ...
Stan Brown meinte:
must work without JS, even in IE,
I suppose that's pretty impossible. If you're talking about IE6 or
earlier.
Anyway, "dropdown menus for ie without javascript" gives me 106.000
hits. Still, I don't think there is a pure-css-and-ie6-too version among
them.
Here's one:
http://barefile.com.au/cssmenu/
Even supports IE5.5.
Richard, that looks very interesting!
Do you have anything written up that explains the techniques you used?
Not as yet. I just pulled it out of one of my CMS's in answer to a post a
few weeks ago.
>Specifically, examining the HTML/CSS I'm wondering about the structure of
the second and third menu items from the left.
Nothing very dramatic. The sub-menu is in a table, initially hidden and
positioned absolutely in its (relatively positioned) parent. The conditional
comments determine what HTML each browser sees.
Specifically:
<!--[if gt IE 6]><!--></a><!--<![endif]-->
The </awill be seen by IE7 (and above) because of the conditional
comments, and all non-IE browsers who correctly parse away the comments.
This method is explained on Microsofts site, it's kind of a reverse
conditional comment.
<!--[if lte IE 6]></a><![endif]-->
The </ais only seen by IE 6 and below.
As for the menu:
IE6 and below see a <li(the top level item) containing a <a_which
contains the table_. Visibility of the table is controlled by .nav a:hover
table. This is of course invalid HTML but who cares, we are throwing it only
at IE6 and below and they seem quite happy with it.
All other browsers see a <licontaining both a <aand the table, with the
table _following_ the <a>. Visibility of the table is controlled by .nav
li:hover table.
Note there is a bit of fluff in the HTML to allow the CMS to apply differing
effects to the menu.
Thanks again for this, Richard.
Ok, I've been spending some time on it and I have a couple of questions.
1. Why use a table for the menu items? As opposed to list items, for
example?
2. Do you have an example of this scheme which implements additional
sub-levels?
--
Ed Mullen http://edmullen.net http://mozilla.edmullen.net http://abington.edmullen.net
Why do we drive on parkways and park on driveways?
"Ed Mullen" <ed@edmullen.netwrote in message
news:5_******************************@comcast.com. ..
rf wrote:
>"Ed Mullen" <ed@edmullen.netwrote in message
news:hM******************************@comcast.com ...
>>rf wrote:
>>>http://barefile.com.au/cssmenu/
Thanks again for this, Richard.
Ok, I've been spending some time on it and I have a couple of questions.
1. Why use a table for the menu items? As opposed to list items, for
example?
Hmmm. Been a while.
1) IE6 will only play nicely with this for a few elements within the <a>.
<tableis one of these. The more semantcally correct <ulis not, so even
when using a <ulfor the sub menu it needs to be enclosed in a single
celled table.
2) A <ulworked for me with some of the simpler layouts (top flat seperate
IIRC) (in a single celled table for IE6) but with the more complex ones I
had one hell of a time with selecting the appropriate <licross browser. It
became so annoying that I reverted to using a table (which nees to be there
for IE6 anyway). May not be "correct" but it works and is a case IMHO of
simply reaching for the hammer when every screwdriver to hand will not drive
the screw in. With some perserverance it could probably be done with list
items but I really could not justify spending any more time on it. If you
only want something simple (and not multi-design as mine is) then go for a
list (inside a table for IE6).
2. Do you have an example of this scheme which implements additional
sub-levels?
It could probably be extended to multi level but I did not for several
reasons.
Even one level of drop down is getting to be a bit of an accessibility
problem. The dropdown is only usable with visual browsers and then only with
a pointing device. (note, my top level menu items are *always* links
themselves, pointing to an intermediate page containing all the "dropdown"
links in a secondary menu bar. This makes the system usable from the
keyboard). A second level of dropdowns would be IMO overkill. I dislike them
myself when I find them on web sites in the wild.
Positioning possible second level dropdowns is a big problem. The menus size
themselves to their content so we don't know where the right hand side of
the dropdowns is, so we don't know where to position the second level
dropdown. This could be fixed by fixing the size of the dropdowns but that
is not part of my design.
Why do we drive on parkways and park on driveways?
Same reason we initiate a Windows shutdown by clicking the start button?
--
Richard.
rf wrote:
"Ed Mullen" <ed@edmullen.netwrote in message
news:5_******************************@comcast.com. ..
>rf wrote:
>>"Ed Mullen" <ed@edmullen.netwrote in message
news:hM******************************@comcast.co m...
rf wrote:
>>>>http://barefile.com.au/cssmenu/
>Thanks again for this, Richard.
Ok, I've been spending some time on it and I have a couple of questions.
1. Why use a table for the menu items? As opposed to list items, for
example?
Hmmm. Been a while.
1) IE6 will only play nicely with this for a few elements within the <a>.
<tableis one of these. The more semantcally correct <ulis not, so even
when using a <ulfor the sub menu it needs to be enclosed in a single
celled table.
2) A <ulworked for me with some of the simpler layouts (top flat seperate
IIRC) (in a single celled table for IE6) but with the more complex ones I
had one hell of a time with selecting the appropriate <licross browser. It
became so annoying that I reverted to using a table (which nees to be there
for IE6 anyway). May not be "correct" but it works and is a case IMHO of
simply reaching for the hammer when every screwdriver to hand will not drive
the screw in. With some perserverance it could probably be done with list
items but I really could not justify spending any more time on it. If you
only want something simple (and not multi-design as mine is) then go for a
list (inside a table for IE6).
>2. Do you have an example of this scheme which implements additional
sub-levels?
It could probably be extended to multi level but I did not for several
reasons.
Even one level of drop down is getting to be a bit of an accessibility
problem. The dropdown is only usable with visual browsers and then only with
a pointing device. (note, my top level menu items are *always* links
themselves, pointing to an intermediate page containing all the "dropdown"
links in a secondary menu bar. This makes the system usable from the
keyboard). A second level of dropdowns would be IMO overkill. I dislike them
myself when I find them on web sites in the wild.
Positioning possible second level dropdowns is a big problem. The menus size
themselves to their content so we don't know where the right hand side of
the dropdowns is, so we don't know where to position the second level
dropdown. This could be fixed by fixing the size of the dropdowns but that
is not part of my design.
Thanks for the detailed reply, Richard. Much appreciated.
I understand your reasoning. In my case, my site is a non-commercial
one and is just a hobby. Hence, while mindful of the usability issues,
I'm not overly concerned with the rare visitor who might be using a
visual browser. I personally like multi-level menus since that's what
virtually all the programs on my Windows computer use, and I'm extremely
familiar with them. But, to each his own. I guess I'll take another
look at Stu Nicholls' menu system. But thanks again for your time and help!
>Why do we drive on parkways and park on driveways?
Same reason we initiate a Windows shutdown by clicking the start button?
<GNice!
--
Ed Mullen http://edmullen.net http://mozilla.edmullen.net http://abington.edmullen.net
If a book about failures does not sell, is it a success?
On Jan 10, 1:46 am, "rf" <r...@invalid.comwrote:
"Gregor Kofler" <use...@gregorkofler.atwrote in message
news:7a***************************@news.inode.at.. .
Anyway, "dropdown menus for ie without javascript" gives me 106.000 hits.
Still, I don't think there is a pure-css-and-ie6-too version among them.
Here's one:
http://barefile.com.au/cssmenu/
Even supports IE5.5.
<nitpick>
11 validation errors
</nitpick>
--
AGw.
Thu, 17 Jan 2008 07:45:51 -0800 (PST) from AGw. (Usenet)
<fr*******@southernskies.co.uk>:
On Jan 10, 1:46 am, "rf" <r...@invalid.comwrote:
"Gregor Kofler" <use...@gregorkofler.atwrote in message
news:7a***************************@news.inode.at.. .
Anyway, "dropdown menus for ie without javascript" gives me 106.000 hits.
Still, I don't think there is a pure-css-and-ie6-too version among them.
Here's one:
http://barefile.com.au/cssmenu/
Even supports IE5.5.
<nitpick>
11 validation errors
</nitpick>
I beg to differ. That's not nitpicking, IMHO. I just assumed that
Gregor was offering valid HTML and CSS. If it's not, I don't want to
use it.
--
Stan Brown, Oak Road Systems, Tompkins County, New York, USA http://OakRoadSystems.com/
HTML 4.01 spec: http://www.w3.org/TR/html401/
validator: http://validator.w3.org/
CSS 2.1 spec: http://www.w3.org/TR/CSS21/
validator: http://jigsaw.w3.org/css-validator/
Why We Won't Help You: http://diveintomark.org/archives/200..._wont_help_you
On Jan 18, 1:13 am, Stan Brown <the_stan_br...@fastmail.fmwrote:
Thu, 17 Jan 2008 07:45:51 -0800 (PST) from AGw. (Usenet)
<freder...@southernskies.co.uk>:
On Jan 10, 1:46 am, "rf" <r...@invalid.comwrote:
"Gregor Kofler" <use...@gregorkofler.atwrote in message
news:7a***************************@news.inode.at.. .
>
Anyway, "dropdown menus for ie without javascript" gives me 106.000 hits.
Still, I don't think there is a pure-css-and-ie6-too version among them.
>
Here's one:
http://barefile.com.au/cssmenu/
>
Even supports IE5.5.
<nitpick>
11 validation errors
</nitpick>
I beg to differ. That's not nitpicking, IMHO. I just assumed that
Gregor was offering valid HTML and CSS. If it's not, I don't want to
use it.
At quick glance the validation errors are quickly fixable, and neither
their existence nor their correction would interfere with the
operation of the code. Granted, I may have missed something obvious!
Incidentally, you've confused Gregor with Richard.
--
AGw. This thread has been closed and replies have been disabled. Please start a new discussion. Similar topics
by: Guotao Luan |
last post by:
Hello All:
I notice that there have been frequent questions being asked about template
here so I guess it is okay to post this message here. I just wrote a c++
tempalte tutorial/review, I would...
|
by: Leslaw Bieniasz |
last post by:
Cracow, 16.09.2004
Hi,
I have a problem with compiling the following construction involving
cross-calls of class template methods, with additional inheritance.
I want to have three class...
|
by: Thomas Casanova |
last post by:
Hi,
I am compiling a MSVC++ project on linux gcc 3.3.4.
gcc is whimsical about templates. It does understand the declaration
of the template type PointerList. It scream the error :...
|
by: eiji |
last post by:
Hi folks,
I have a linker - problem using a Matrix-template.
Maybe someone can help me with that.
Q:
"using femath::Matrix" or "using femath::Matrix<double>";
Consider this:
|
by: Marcelo |
last post by:
Hi everybody,
This is my first time with the template class and I have an strange problem. I
have spent all the afternoon trying to understand it, but I don't get the problem...
I have three...
|
by: Grep J |
last post by:
Hello,
I'm using Visual Studio.NET 2003 and I'm wondering that
is it possible to call XSL file's template to transform a XML file?
I have following files.
A XML file below
<?xml...
|
by: Ted |
last post by:
I have cross posted this to comp.lang.c++ and to sci.math.num-
analysis
in the belief that the topic is of interest to some in both groups.
I am building my toolkit, in support of my efforts in...
|
by: Alex Vinokur |
last post by:
Hi,
I have compilation problem on SUN CC compiler with template while
using option -m64 (64-bit addressing model).
No problem while using option -m32 (32-bit addressing model)
$ CC -V
CC:...
|
by: l.s.rockfan |
last post by:
Hello,
how do i have to call an inherited, templated class constructor from the
initializer list of the inheriting, non-templated class constructor?
example code:
template<typename T>...
|
by: Charles Arthur |
last post by:
How do i turn on java script on a villaon, callus and itel keypad mobile phone
|
by: emmanuelkatto |
last post by:
Hi All, I am Emmanuel katto from Uganda. I want to ask what challenges you've faced while migrating a website to cloud.
Please let me know.
Thanks!
Emmanuel
|
by: BarryA |
last post by:
What are the essential steps and strategies outlined in the Data Structures and Algorithms (DSA) roadmap for aspiring data scientists? How can individuals effectively utilize this roadmap to progress...
|
by: marktang |
last post by:
ONU (Optical Network Unit) is one of the key components for providing high-speed Internet services. Its primary function is to act as an endpoint device located at the user's premises. However,...
|
by: Hystou |
last post by:
Most computers default to English, but sometimes we require a different language, especially when relocating. Forgot to request a specific language before your computer shipped? No problem! You can...
|
by: Oralloy |
last post by:
Hello folks,
I am unable to find appropriate documentation on the type promotion of bit-fields when using the generalised comparison operator "<=>".
The problem is that using the GNU compilers,...
|
by: tracyyun |
last post by:
Dear forum friends,
With the development of smart home technology, a variety of wireless communication protocols have appeared on the market, such as Zigbee, Z-Wave, Wi-Fi, Bluetooth, etc. Each...
|
by: agi2029 |
last post by:
Let's talk about the concept of autonomous AI software engineers and no-code agents. These AIs are designed to manage the entire lifecycle of a software development project—planning, coding, testing,...
|
by: isladogs |
last post by:
The next Access Europe User Group meeting will be on Wednesday 1 May 2024 starting at 18:00 UK time (6PM UTC+1) and finishing by 19:30 (7.30PM).
In this session, we are pleased to welcome a new...
| |
