|
|
|
|
"Introduction
------------
After *many* hours of battling with CSS rules and DOM objects
this menu has been designed as an alternative to the JSCookMenu (or osC_Categories MS2-2.2 contribution).
Because the markup is a nested set of un-ordered lists
this menu is Search Engine Friendly.
However for the best effect the user should have javascript enabled.
but if they do not and are using a CSS-compliant browsers,
the CSS rules will show the first three sub-menu levels.
Unfortunately for Internet Explorer users with javascript disabled they
will currently only see the main (top level) categories shown in the
categories box.
It might be possible to use the <noscript> tag to include some overriding
CSS Rules so that the un-ordered list would then show nicely its submenu
options inside the categories box, but I haven't tested this.
Or some other means of accessiblily may need to be provided.
I'm hoping that others will be able to help out with further
development, such as looking into the above mentioned noscript
css rules and also getting together a php class menu builder which
could then also be used in the admin.
Please test menu first to see whether it will suit your needs prior
to installing on your live production site.
You can see a working demo here:
http://www.devosc.com/kb/
So far I have tested this menu in
FireFox 1.0, Epiphany 1.0.7, Konqueror 3.2.1, I.E. 6 SP1, Opera 8
The jcssMenu functions well in all of them, however Opera does not support
the last-child style selector and so child menus in Opera do not have
a bottom border, and trying to accomodate this in the javascript seems to
be too resource intensive - or I just haven't had the time to find the most
optimal method without going through loops etc...
What makes this menu so special ?
---------------------------------
Firstly a timer has been added so that if javascript is enabled then the
menus will not dissapear as soon as the mouse moves away from them unlike
the css reliant (non javascript) version.
Also, after some serious understanding of CSS I finally managed to provide
each submenu the ability to have its own size, normally (since this is an
un-order list markup) child containers would inherit their parents dimensions.
But this causes problems if one of the menu options has a long text length which
would cause (require) the entire menu system to have the same size child menus.
But by floating each LI tag they can take their own shape, however their parent
UL container then loses its dimensions, so while looping through in the javascript
to add the mouseover functions some extra code exists which determines the maximum
offsetWidth for each child menu and sets the width of each LI to the maximum width
which reconstructs the rectangular container. Hence it is best if the user has
javascript enabled (which they would need if they want to access a deeply nested
categories).
For those interested in CSS visit http://www.csscreator.com
The aim of making this contribution publically available from the
osCommerce servers is so that fellow contributors can help progress this application
further. However, I would mention that it costs time and resources to develop
contributions, for which donations are appreciated.
devosc,
http://www.devosc.com" |
|
|
|
 |
| For more information, visit the official osCommerce contribution webpage. |
|
|
|
