An Accordion Widget as read by JAWS

"kiusau" <webforumsuser (AT) macromedia (DOT) com> wrote

[q]I'm afraid I've forgotten. If you can restate the question I'll see if
there
is a solution.[/q]
If there had been a question, I would have no trouble finding it, as I
subscribe to my own questions. You offered a complimentary vertical
accordion
in your own entry, and I needed a horizontal menubar that would spread
across
the width of my expanding main content <div> tag.

I am currently looking for a coordinated, tight fit between banner,
accordion
panel, and expanding horizontal menu bar. Although I am very capable of
matching the height of the first panel tab of my accordion with the height
of
the horizontal menu bar, I still do not know how to make the menu bar fit
the
entire width of my browser window.

Adobe shows how to center its horizontal menu bar across the top of a
page,
but it does not show how to make it expand across the entire width of a
div
tag. Do you recall the problem now?

SOURCE PAGE:
http://homepage.mac.com/moogoonghwa/Imagine_Prototype/Content/

The menu bar is not in your main content div. Place it inside of:
<div id="mainContent">

Then you can assign a percentage width to your root LI elements - 25% each.
You may have to manually ID the last LI item and use a conditional comment
to set it to 24% for IE if you encounter rounding errors.

You also need to clear the floats from your menu's root items. The safest
way for a CSS novice to do that is to wrap your menu inside a DIV insert
another DIV just inside the closing DIV tag with a clear both declaration:

<div id="mainContent">
<div id="menuwrapper">
Menu in here
<div class="clearfloat">&nbsp;</div>
</div>
main content
</div>

..clearfloat {
clear: both;
height: 0;
line-height: 0.0;
font-size: 0;
}

That should get you fixed. Beyond that, my original advice that Spry is not
very good or accessible still stands. But I'm not going to debate it this
time.


--
Al Sparber - PVII
http://www.projectseven.com
The Finest Dreamweaver Menus | Galleries | Widgets
http://www.projectseven.com/go/pop
The Ultimate DW Menu System

"TC2112" <nospam (AT) nospam (DOT) com> wrote

"vis-a-vis David Bowie.." ?!!!
I think I just hurt something laughing....

Hey, may I borrow this?
I'd like to drop the "Lorem Ipsum" in my mockups and use this instead.....

Sure :-)

I made it an extension years ago but can't find the package files or I'd
post it.

[Q]The menu bar is not in your main content div. Place it inside of: <div
id="mainContent">[/Q]
When I do this I lose the handsome fit between banner, accordion, and menu bar
that currently exists and fear that it will be very difficult to restore from
within the main content <div> tag. Can the same effect not be achieved with
the [BULLET] tag between the floated sidebar <div> tag and the main content
<div> tag?

Roddy :smile;

ADDENDUM
For example, the main content sits where it does on the page, because its left
margin is equal, or approximately equal, to the width of the sidebar div. Can
a similar margin not be set for the [BULLET] tag that forms the menu bar and
still achieve the suggested adjustments?

Roddy :smile;

"kiusau" <webforumsuser (AT) macromedia (DOT) com> wrote

[Q]The menu bar is not in your main content div. Place it inside of: <div
id="mainContent">[/Q]
When I do this I lose the handsome fit between banner, accordion, and menu
bar
that currently exists and fear that it will be very difficult to restore
from
within the main content <div> tag. Can the same effect not be achieved
with
the [BULLET] tag between the floated sidebar <div> tag and the main
content
div> tag?

No. In order to clear the sidebar, the UL would need a left margin in
pixels. Margin is part of the CSS box for the UL, so there would be no way
to evenly distribute the LI items to fill a proportional space because the
left margin would always be fixed. It would be like trying to add 180px +
25%. The result is always based on the width of the parent.

To match up the menu items with the accordion heading simply style them
identically with respect to font-size, line-height, top border, bottom
border, top padding, and bottom padding.


--
Al Sparber - PVII
http://www.projectseven.com
The Finest Dreamweaver Menus | Galleries | Widgets
http://www.projectseven.com/go/pop
The Ultimate DW Menu System

[Q]The menu bar is not in your main content div. Place it inside of: <div>
id="mainContent">[/Q]

With the assumption that you understand how to achieve a fully expandable,
horizontal menu bar I would like to focus for the moment solely on the
placement of the menu bar. Please view what happens when I do, as I believe
you have instructed.

<head>
<style type="text/css">
.clearfloat {
clear: both;
height: 0;
line-height: 0.0;
font-size: 0;
}
</style>
</head>

<div id="mainContent>
[BULLET][menubar][/BULLET]
<div class="clearfloat">&nbsp;</div>
Blah, blah, blah.
</div>

When I follow the above instructions, the menu bar aligns at the top, but
assumes the same left margin as the mainContent <div> tag. Moreover, the
content of the mainContent <div> tag drops below the content of the left
sidebar <div> tag. (See Page Update below.)

In contrast, when I do the same, but remove the clearfloat <div> tag , the
content of the mainContent <div> tag returns to its proper position to the
right of the left sidebar, but the menu bar separates from the banner and
assume the same location as would the content, if no menu bar were present.
(Not shown in Page Update.)

PAGE UPDATE:
http://homepage.mac.com/moogoonghwa/Imagine_Prototype/Content/

Roddy :smile;

Set the root menu container to overflow: hidden.

Here is a quick example using our menu and accordion:
http://www.projectseven.com/testing/customers/roddy72/

--
Al Sparber - PVII
http://www.projectseven.com
The Finest Dreamweaver Menus | Galleries | Widgets
http://www.projectseven.com/go/pop
The Ultimate DW Menu System




"kiusau" <webforumsuser (AT) macromedia (DOT) com> wrote

[Q]The menu bar is not in your main content div. Place it inside of: <div
id="mainContent">[/Q]

With the assumption that you understand how to achieve a fully expandable,
horizontal menu bar I would like to focus for the moment solely on the
placement of the menu bar. Please view what happens when I do, as I
believe
you have instructed.

head
style type="text/css"
.clearfloat {
clear: both;
height: 0;
line-height: 0.0;
font-size: 0;
}
/style
/head

div id="mainContent
[BULLET][menubar][/BULLET]
div class="clearfloat">&nbsp;</div
Blah, blah, blah.
/div

When I follow the above instructions, the menu bar aligns at the top, but
assumes the same left margin as the mainContent <div> tag. Moreover, the
content of the mainContent <div> tag drops below the content of the left
sidebar <div> tag. (See Page Update below.)

In contrast, when I do the same, but remove the clearfloat <div> tag , the
content of the mainContent <div> tag returns to its proper position to the
right of the left sidebar, but the menu bar separates from the banner and
assume the same location as would the content, if no menu bar were
present.
(Not shown in Page Update.)

PAGE UPDATE:
http://homepage.mac.com/moogoonghwa/Imagine_Prototype/Content/

Roddy :smile;

[q]Here is a quick example using our menu and accordion:
http://www.projectseven.com/testing/customers/roddy72/[/q]

Although we have some disagreement about the venue, you are a good
salesperson. I say this, because you obviously believe in your product and
style it according to your client's taste and need. Indeed, if your menu bar
and accordion are more accessible, as you claim, then what you have shown is
preferable to what I am currently trying to achieve.

This said, I am trying to learn, and buying my way out of my dilemma or
accepting complimentary gifts would likely serve as a disincentive for my
further edification with regard to the structure, behavior, placement, and
appearance of SPRY objects. There is also the dependency question, because we
did get off to such a very bad start, I am not sure that Project-Seven
after-service is my best alternative for the moment.

Another consideration is that no one, but yourself, appears either interested
or capable of helping me resolve my current problem. In the end, it is also
silly for me to expect that you will want to spend very much time with me
trying to fix an Adobe product, when you have another that you believe to be
superior.

Finally, there is the issue of time. Rather than struggling to "reinvent the
wheel" as you once said, I could be working on other pressing issues such as
print media and my further acquisition of JavaScript.

Having taken all of this into consideration and still unable to make my
horizontal menu bar perform. I would like to propose the following:

You once offered to provide a complimentary accordion that I did not need. I
am now willing to accept that offer with purchase of the Project Seven
horizontal menu bar and a copy of roddy72 (original format) that I do need.
Perhaps Murray or someone else very close to Project-Seven could serve as a
go-between with regard to after service. If you will agree to this, then
please tell me how to proceed, so that I can begin moving forward once again.
This menu bar issue has already taken too large a toll in time, effort, and
reputation.

IMAGINE PROTOTYPE:
http://homepage.mac.com/moogoonghwa/Imagine_Prototype/Content/

Roddy :smile;

Hi Roddy,

You once offered to provide a complimentary accordion that I did not need.
I
am now willing to accept that offer with purchase of the Project Seven
horizontal menu bar and a copy of roddy72 (original format) that I do
need.
Perhaps Murray or someone else very close to Project-Seven could serve as
a
go-between with regard to after service. If you will agree to this, then
please tell me how to proceed, so that I can begin moving forward once
again.
This menu bar issue has already taken too large a toll in time, effort,
and
reputation.

Now you're talking! Get PMM2 - the latest menu - it goes vertical and
horizontal and will delight you, I am sure - very cool and fun to use. You
will find plenty to learn from studying the very-well commented style sheets
as well.

I doubt you need Murray or any other intermediary - you guys are getting
along splendidly!

--
Aloha,

Jerry
http://MauiWebDesigns.com

Al Sparber - PVII wrote:

"TC2112" <nospam (AT) nospam (DOT) com> wrote in message
news:gq4496$rab$1 (AT) forums (DOT) macromedia.com...
"vis-a-vis David Bowie.." ?!!!
I think I just hurt something laughing....

Hey, may I borrow this?
I'd like to drop the "Lorem Ipsum" in my mockups and use this
instead.....

Sure :-)

I made it an extension years ago but can't find the package files or I'd
post it.

I would love to see this back as an extension!

Dooza
--
Posting Guidelines
http://www.adobe.com/support/forums/guidelines.html
How To Ask Smart Questions
http://www.catb.org/esr/faqs/smart-questions.html