Loading ...
Sorry, an error occurred while loading the content.

About the width of navigation menubarItem

Expand Messages
  • jimmy_chu0807
    Referring to this example: http://developer.yahoo.com/yui/examples/menu/topnavfrommarkupwithanim_so urce.html I was playing around with this example.
    Message 1 of 11 , Sep 3, 2007
    • 0 Attachment
      Referring to this example:
      http://developer.yahoo.com/yui/examples/menu/topnavfrommarkupwithanim_so\
      urce.html

      I was playing around with this example. Currently the <body> tag is
      belong to "yui-skin-sam" class. Now I:
      1. Add another <div> tag immediately within the <body> that surround
      the whole body,
      2. Set the div class attribute to yui-skin-sam and,
      3. Remove the class attribute in <body> tag

      I suppose there shouldn't be change in the layout. But I realized the
      width of the menubarItems have changed - some items has the texts
      overflow the width, and some underflow.

      So, how do I set the class "yui-skin-sam" properly for a certain
      portion of the page, but not the whole body?


      Thanks for any feedback
    • Keith Frank
      ... http://developer.yahoo.com/yui/examples/menu/topnavfrommarkupwithanim_so ... I ve had exactly the same problem trying to modify this example. I simply
      Message 2 of 11 , Sep 4, 2007
      • 0 Attachment
        --- In ydn-javascript@yahoogroups.com, "jimmy_chu0807" <chuj@...> wrote:
        >
        > Referring to this example:
        >
        http://developer.yahoo.com/yui/examples/menu/topnavfrommarkupwithanim_so\
        > urce.html
        >
        > I was playing around with this example. Currently the <body> tag is
        > belong to "yui-skin-sam" class. Now I:
        > 1. Add another <div> tag immediately within the <body> that surround
        > the whole body,
        > 2. Set the div class attribute to yui-skin-sam and,
        > 3. Remove the class attribute in <body> tag
        >
        > I suppose there shouldn't be change in the layout. But I realized the
        > width of the menubarItems have changed - some items has the texts
        > overflow the width, and some underflow.
        >
        > So, how do I set the class "yui-skin-sam" properly for a certain
        > portion of the page, but not the whole body?
        >
        >
        > Thanks for any feedback
        >
        I've had exactly the same problem trying to modify this example.
        I simply wrapped the whole menu in a new div, removed the class name
        from the body tag and added it to my new wrapper div. After setting
        the width on my new wrapper div to 700px all of the drop down menu
        widths were all screwed up some way too wide some way to thin so that
        the text overlapped the menu. It would be nice to know if anyone has
        had and solved this issue.
      • Caridy Patiño Mayea
        Hi, The problem is that the overlay s control uses a RENDER process to create the DOM structure of the controls, and usually this structure is created over the
        Message 3 of 11 , Sep 4, 2007
        • 0 Attachment
          Hi,

          The problem is that the overlay's control uses a RENDER process to
          create the DOM structure of the controls, and usually this structure
          is created over the document.body if you don't specify a DOM element
          in the render function:

          oMenu.render ( 'myCustomWrapper' );

          And then:

          <body>
          <div class="yui-skin-sam">
          // your page here...
          </div>
          <div class="yui-menu">
          </div>
          </body>

          As you see in the example... the CSS rule:

          .yui-skin-sam .yui-menu {
          }

          will not be applied correctly. That's why you need to define the
          yui-skin-sam to the body instead to use a DIV.

          Best Regards,
          Caridy (caridy at gmail.com)
          http://www.bubbling-library.com/

          --- In ydn-javascript@yahoogroups.com, "Keith Frank" <keith.frank@...>
          wrote:
          >
          > --- In ydn-javascript@yahoogroups.com, "jimmy_chu0807" <chuj@> wrote:
          > >
          > > Referring to this example:
          > >
          >
          http://developer.yahoo.com/yui/examples/menu/topnavfrommarkupwithanim_so\
          > > urce.html
          > >
          > > I was playing around with this example. Currently the <body> tag is
          > > belong to "yui-skin-sam" class. Now I:
          > > 1. Add another <div> tag immediately within the <body> that surround
          > > the whole body,
          > > 2. Set the div class attribute to yui-skin-sam and,
          > > 3. Remove the class attribute in <body> tag
          > >
          > > I suppose there shouldn't be change in the layout. But I realized the
          > > width of the menubarItems have changed - some items has the texts
          > > overflow the width, and some underflow.
          > >
          > > So, how do I set the class "yui-skin-sam" properly for a certain
          > > portion of the page, but not the whole body?
          > >
          > >
          > > Thanks for any feedback
          > >
          > I've had exactly the same problem trying to modify this example.
          > I simply wrapped the whole menu in a new div, removed the class name
          > from the body tag and added it to my new wrapper div. After setting
          > the width on my new wrapper div to 700px all of the drop down menu
          > widths were all screwed up some way too wide some way to thin so that
          > the text overlapped the menu. It would be nice to know if anyone has
          > had and solved this issue.
          >
        • Keith Frank
          ... http://developer.yahoo.com/yui/examples/menu/topnavfrommarkupwithanim_so ... surround ... realized the ... Thanks for the reply... So let me see if I have
          Message 4 of 11 , Sep 4, 2007
          • 0 Attachment
            --- In ydn-javascript@yahoogroups.com, Caridy Patiño Mayea
            <caridy@...> wrote:
            >
            > Hi,
            >
            > The problem is that the overlay's control uses a RENDER process to
            > create the DOM structure of the controls, and usually this structure
            > is created over the document.body if you don't specify a DOM element
            > in the render function:
            >
            > oMenu.render ( 'myCustomWrapper' );
            >
            > And then:
            >
            > <body>
            > <div class="yui-skin-sam">
            > // your page here...
            > </div>
            > <div class="yui-menu">
            > </div>
            > </body>
            >
            > As you see in the example... the CSS rule:
            >
            > .yui-skin-sam .yui-menu {
            > }
            >
            > will not be applied correctly. That's why you need to define the
            > yui-skin-sam to the body instead to use a DIV.
            >
            > Best Regards,
            > Caridy (caridy at gmail.com)
            > http://www.bubbling-library.com/
            >
            > --- In ydn-javascript@yahoogroups.com, "Keith Frank" <keith.frank@>
            > wrote:
            > >
            > > --- In ydn-javascript@yahoogroups.com, "jimmy_chu0807" <chuj@> wrote:
            > > >
            > > > Referring to this example:
            > > >
            > >
            >
            http://developer.yahoo.com/yui/examples/menu/topnavfrommarkupwithanim_so\
            > > > urce.html
            > > >
            > > > I was playing around with this example. Currently the <body> tag is
            > > > belong to "yui-skin-sam" class. Now I:
            > > > 1. Add another <div> tag immediately within the <body> that
            surround
            > > > the whole body,
            > > > 2. Set the div class attribute to yui-skin-sam and,
            > > > 3. Remove the class attribute in <body> tag
            > > >
            > > > I suppose there shouldn't be change in the layout. But I
            realized the
            > > > width of the menubarItems have changed - some items has the texts
            > > > overflow the width, and some underflow.
            > > >
            > > > So, how do I set the class "yui-skin-sam" properly for a certain
            > > > portion of the page, but not the whole body?
            > > >
            > > >
            > > > Thanks for any feedback
            > > >
            > > I've had exactly the same problem trying to modify this example.
            > > I simply wrapped the whole menu in a new div, removed the class name
            > > from the body tag and added it to my new wrapper div. After setting
            > > the width on my new wrapper div to 700px all of the drop down menu
            > > widths were all screwed up some way too wide some way to thin so that
            > > the text overlapped the menu. It would be nice to know if anyone has
            > > had and solved this issue.
            > >
            >
            Thanks for the reply...
            So let me see if I have this straight.
            If you create your menu from markup you "must" put
            'class="yui-skin-sam"' in the body tag(not in the wrapper div tag)?

            I tried with markup and a div wrapper and changed the render method to
            take the wrapper ID as an argument
            oMenuBar.render("wrapperDiv")
            but that did not work it.

            Seems odd that you cannot just add class="yui-skin-sam" to any block
            level element wrapping the menu if you are creating a menu from
            existing markup.

            If I've got this wrong I would appreciate an example of how to do this.

            Thanks Again for your time,
            Keith
          • Caridy Patiño Mayea
            Hi Keith, The render method uses the parameter to create the DOM structure for overlay s controls created from javascript (will be discarded when you use a
            Message 5 of 11 , Sep 4, 2007
            • 0 Attachment
              Hi Keith,

              The render method uses the parameter to create the DOM structure for
              overlay's controls created from javascript (will be discarded when you
              use a markup). But some floating elements (submenus) use absolute
              position (which means that the element's structure will be removed
              from the DOM to be floating), when this happen, some CSS's rules don't
              work as we expect it.

              For floating elements, you need to apply the "yui-skin-sam" class to
              the "document.body".

              Best Regards,
              Caridy (caridy at gmail.com)
              http://www.bubbling-library.com/

              --- In ydn-javascript@yahoogroups.com, "Keith Frank" <keith.frank@...>
              wrote:
              >
              > --- In ydn-javascript@yahoogroups.com, Caridy Patiño Mayea
              > <caridy@> wrote:
              > >
              > > Hi,
              > >
              > > The problem is that the overlay's control uses a RENDER process to
              > > create the DOM structure of the controls, and usually this structure
              > > is created over the document.body if you don't specify a DOM element
              > > in the render function:
              > >
              > > oMenu.render ( 'myCustomWrapper' );
              > >
              > > And then:
              > >
              > > <body>
              > > <div class="yui-skin-sam">
              > > // your page here...
              > > </div>
              > > <div class="yui-menu">
              > > </div>
              > > </body>
              > >
              > > As you see in the example... the CSS rule:
              > >
              > > .yui-skin-sam .yui-menu {
              > > }
              > >
              > > will not be applied correctly. That's why you need to define the
              > > yui-skin-sam to the body instead to use a DIV.
              > >
              > > Best Regards,
              > > Caridy (caridy at gmail.com)
              > > http://www.bubbling-library.com/
              > >
              > > --- In ydn-javascript@yahoogroups.com, "Keith Frank" <keith.frank@>
              > > wrote:
              > > >
              > > > --- In ydn-javascript@yahoogroups.com, "jimmy_chu0807" <chuj@>
              wrote:
              > > > >
              > > > > Referring to this example:
              > > > >
              > > >
              > >
              >
              http://developer.yahoo.com/yui/examples/menu/topnavfrommarkupwithanim_so\
              > > > > urce.html
              > > > >
              > > > > I was playing around with this example. Currently the <body>
              tag is
              > > > > belong to "yui-skin-sam" class. Now I:
              > > > > 1. Add another <div> tag immediately within the <body> that
              > surround
              > > > > the whole body,
              > > > > 2. Set the div class attribute to yui-skin-sam and,
              > > > > 3. Remove the class attribute in <body> tag
              > > > >
              > > > > I suppose there shouldn't be change in the layout. But I
              > realized the
              > > > > width of the menubarItems have changed - some items has the texts
              > > > > overflow the width, and some underflow.
              > > > >
              > > > > So, how do I set the class "yui-skin-sam" properly for a certain
              > > > > portion of the page, but not the whole body?
              > > > >
              > > > >
              > > > > Thanks for any feedback
              > > > >
              > > > I've had exactly the same problem trying to modify this example.
              > > > I simply wrapped the whole menu in a new div, removed the class name
              > > > from the body tag and added it to my new wrapper div. After setting
              > > > the width on my new wrapper div to 700px all of the drop down menu
              > > > widths were all screwed up some way too wide some way to thin so
              that
              > > > the text overlapped the menu. It would be nice to know if anyone has
              > > > had and solved this issue.
              > > >
              > >
              > Thanks for the reply...
              > So let me see if I have this straight.
              > If you create your menu from markup you "must" put
              > 'class="yui-skin-sam"' in the body tag(not in the wrapper div tag)?
              >
              > I tried with markup and a div wrapper and changed the render method to
              > take the wrapper ID as an argument
              > oMenuBar.render("wrapperDiv")
              > but that did not work it.
              >
              > Seems odd that you cannot just add class="yui-skin-sam" to any block
              > level element wrapping the menu if you are creating a menu from
              > existing markup.
              >
              > If I've got this wrong I would appreciate an example of how to do this.
              >
              > Thanks Again for your time,
              > Keith
              >
            • Keith Frank
              ... http://developer.yahoo.com/yui/examples/menu/topnavfrommarkupwithanim_so ... texts ... certain ... class name ... setting ... anyone has ... this. ...
              Message 6 of 11 , Sep 4, 2007
              • 0 Attachment
                --- In ydn-javascript@yahoogroups.com, Caridy Patiño Mayea
                <caridy@...> wrote:
                >
                > Hi Keith,
                >
                > The render method uses the parameter to create the DOM structure for
                > overlay's controls created from javascript (will be discarded when you
                > use a markup). But some floating elements (submenus) use absolute
                > position (which means that the element's structure will be removed
                > from the DOM to be floating), when this happen, some CSS's rules don't
                > work as we expect it.
                >
                > For floating elements, you need to apply the "yui-skin-sam" class to
                > the "document.body".
                >
                > Best Regards,
                > Caridy (caridy at gmail.com)
                > http://www.bubbling-library.com/
                >
                > --- In ydn-javascript@yahoogroups.com, "Keith Frank" <keith.frank@>
                > wrote:
                > >
                > > --- In ydn-javascript@yahoogroups.com, Caridy Patiño Mayea
                > > <caridy@> wrote:
                > > >
                > > > Hi,
                > > >
                > > > The problem is that the overlay's control uses a RENDER process to
                > > > create the DOM structure of the controls, and usually this structure
                > > > is created over the document.body if you don't specify a DOM element
                > > > in the render function:
                > > >
                > > > oMenu.render ( 'myCustomWrapper' );
                > > >
                > > > And then:
                > > >
                > > > <body>
                > > > <div class="yui-skin-sam">
                > > > // your page here...
                > > > </div>
                > > > <div class="yui-menu">
                > > > </div>
                > > > </body>
                > > >
                > > > As you see in the example... the CSS rule:
                > > >
                > > > .yui-skin-sam .yui-menu {
                > > > }
                > > >
                > > > will not be applied correctly. That's why you need to define the
                > > > yui-skin-sam to the body instead to use a DIV.
                > > >
                > > > Best Regards,
                > > > Caridy (caridy at gmail.com)
                > > > http://www.bubbling-library.com/
                > > >
                > > > --- In ydn-javascript@yahoogroups.com, "Keith Frank" <keith.frank@>
                > > > wrote:
                > > > >
                > > > > --- In ydn-javascript@yahoogroups.com, "jimmy_chu0807" <chuj@>
                > wrote:
                > > > > >
                > > > > > Referring to this example:
                > > > > >
                > > > >
                > > >
                > >
                >
                http://developer.yahoo.com/yui/examples/menu/topnavfrommarkupwithanim_so\
                > > > > > urce.html
                > > > > >
                > > > > > I was playing around with this example. Currently the <body>
                > tag is
                > > > > > belong to "yui-skin-sam" class. Now I:
                > > > > > 1. Add another <div> tag immediately within the <body> that
                > > surround
                > > > > > the whole body,
                > > > > > 2. Set the div class attribute to yui-skin-sam and,
                > > > > > 3. Remove the class attribute in <body> tag
                > > > > >
                > > > > > I suppose there shouldn't be change in the layout. But I
                > > realized the
                > > > > > width of the menubarItems have changed - some items has the
                texts
                > > > > > overflow the width, and some underflow.
                > > > > >
                > > > > > So, how do I set the class "yui-skin-sam" properly for a
                certain
                > > > > > portion of the page, but not the whole body?
                > > > > >
                > > > > >
                > > > > > Thanks for any feedback
                > > > > >
                > > > > I've had exactly the same problem trying to modify this example.
                > > > > I simply wrapped the whole menu in a new div, removed the
                class name
                > > > > from the body tag and added it to my new wrapper div. After
                setting
                > > > > the width on my new wrapper div to 700px all of the drop down menu
                > > > > widths were all screwed up some way too wide some way to thin so
                > that
                > > > > the text overlapped the menu. It would be nice to know if
                anyone has
                > > > > had and solved this issue.
                > > > >
                > > >
                > > Thanks for the reply...
                > > So let me see if I have this straight.
                > > If you create your menu from markup you "must" put
                > > 'class="yui-skin-sam"' in the body tag(not in the wrapper div tag)?
                > >
                > > I tried with markup and a div wrapper and changed the render method to
                > > take the wrapper ID as an argument
                > > oMenuBar.render("wrapperDiv")
                > > but that did not work it.
                > >
                > > Seems odd that you cannot just add class="yui-skin-sam" to any block
                > > level element wrapping the menu if you are creating a menu from
                > > existing markup.
                > >
                > > If I've got this wrong I would appreciate an example of how to do
                this.
                > >
                > > Thanks Again for your time,
                > > Keith
                > >
                >
                Caridy,
                Thanks for clarifying.
                Keith
              • Todd Kloots
                This problem will be fixed in the upcoming 2.3.1 release of YUI. - Todd
                Message 7 of 11 , Sep 7, 2007
                • 0 Attachment
                  This problem will be fixed in the upcoming 2.3.1 release of YUI.

                  - Todd

                  Caridy Patiño Mayea wrote:
                  >
                  > Hi,
                  >
                  > The problem is that the overlay's control uses a RENDER process to
                  > create the DOM structure of the controls, and usually this structure
                  > is created over the document.body if you don't specify a DOM element
                  > in the render function:
                  >
                  > oMenu.render ( 'myCustomWrapper' );
                  >
                  > And then:
                  >
                  > <body>
                  > <div class="yui-skin-sam">
                  > // your page here...
                  > </div>
                  > <div class="yui-menu">
                  > </div>
                  > </body>
                  >
                  > As you see in the example... the CSS rule:
                  >
                  > .yui-skin-sam .yui-menu {
                  > }
                  >
                  > will not be applied correctly. That's why you need to define the
                  > yui-skin-sam to the body instead to use a DIV.
                  >
                  > Best Regards,
                  > Caridy (caridy at gmail.com)
                  > http://www.bubbling-library.com/ <http://www.bubbling-library.com/>
                  >
                  > --- In ydn-javascript@yahoogroups.com
                  > <mailto:ydn-javascript%40yahoogroups.com>, "Keith Frank" <keith.frank@...>
                  > wrote:
                  > >
                  > > --- In ydn-javascript@yahoogroups.com
                  > <mailto:ydn-javascript%40yahoogroups.com>, "jimmy_chu0807" <chuj@> wrote:
                  > > >
                  > > > Referring to this example:
                  > > >
                  > >
                  > http://developer.yahoo.com/yui/examples/menu/topnavfrommarkupwithanim_so\
                  > <http://developer.yahoo.com/yui/examples/menu/topnavfrommarkupwithanim_so>>
                  > > urce.html
                  > > >
                  > > > I was playing around with this example. Currently the <body> tag is
                  > > > belong to "yui-skin-sam" class. Now I:
                  > > > 1. Add another <div> tag immediately within the <body> that surround
                  > > > the whole body,
                  > > > 2. Set the div class attribute to yui-skin-sam and,
                  > > > 3. Remove the class attribute in <body> tag
                  > > >
                  > > > I suppose there shouldn't be change in the layout. But I realized the
                  > > > width of the menubarItems have changed - some items has the texts
                  > > > overflow the width, and some underflow.
                  > > >
                  > > > So, how do I set the class "yui-skin-sam" properly for a certain
                  > > > portion of the page, but not the whole body?
                  > > >
                  > > >
                  > > > Thanks for any feedback
                  > > >
                  > > I've had exactly the same problem trying to modify this example.
                  > > I simply wrapped the whole menu in a new div, removed the class name
                  > > from the body tag and added it to my new wrapper div. After setting
                  > > the width on my new wrapper div to 700px all of the drop down menu
                  > > widths were all screwed up some way too wide some way to thin so that
                  > > the text overlapped the menu. It would be nice to know if anyone has
                  > > had and solved this issue.
                  > >
                  >
                  >
                • bcarroll2k3
                  Hi Todd, Not trying to get you to commit to anything, but is the 2.3.1 release going to be sooner than later? I ask because I ve run into this same problem.
                  Message 8 of 11 , Sep 7, 2007
                  • 0 Attachment
                    Hi Todd,

                    Not trying to get you to commit to anything, but is the 2.3.1 release
                    going to be sooner than later? I ask because I've run into this same
                    problem. If not sooner, is there a workaround posted somewhere that
                    we can use? I checked the menu 'known issues' but didn't see
                    anything posted.

                    Thanks!

                    -B

                    --- In ydn-javascript@yahoogroups.com, Todd Kloots <kloots@...> wrote:
                    >
                    > This problem will be fixed in the upcoming 2.3.1 release of YUI.
                    >
                    > - Todd
                    >
                    > Caridy Patiño Mayea wrote:
                    > >
                    > > Hi,
                    > >
                    > > The problem is that the overlay's control uses a RENDER process to
                    > > create the DOM structure of the controls, and usually this
                    structure
                    > > is created over the document.body if you don't specify a DOM
                    element
                    > > in the render function:
                    > >
                    > > oMenu.render ( 'myCustomWrapper' );
                    > >
                    > > And then:
                    > >
                    > > <body>
                    > > <div class="yui-skin-sam">
                    > > // your page here...
                    > > </div>
                    > > <div class="yui-menu">
                    > > </div>
                    > > </body>
                    > >
                    > > As you see in the example... the CSS rule:
                    > >
                    > > .yui-skin-sam .yui-menu {
                    > > }
                    > >
                    > > will not be applied correctly. That's why you need to define the
                    > > yui-skin-sam to the body instead to use a DIV.
                    > >
                    > > Best Regards,
                    > > Caridy (caridy at gmail.com)
                    > > http://www.bubbling-library.com/ <http://www.bubbling-
                    library.com/>
                    > >
                    > > --- In ydn-javascript@yahoogroups.com
                    > > <mailto:ydn-javascript%40yahoogroups.com>, "Keith Frank"
                    <keith.frank@>
                    > > wrote:
                    > > >
                    > > > --- In ydn-javascript@yahoogroups.com
                    > > <mailto:ydn-javascript%40yahoogroups.com>, "jimmy_chu0807"
                    <chuj@> wrote:
                    > > > >
                    > > > > Referring to this example:
                    > > > >
                    > > >
                    > >
                    http://developer.yahoo.com/yui/examples/menu/topnavfrommarkupwithanim_
                    so\
                    > >
                    <http://developer.yahoo.com/yui/examples/menu/topnavfrommarkupwithanim
                    _so>>
                    > > > urce.html
                    > > > >
                    > > > > I was playing around with this example. Currently the <body>
                    tag is
                    > > > > belong to "yui-skin-sam" class. Now I:
                    > > > > 1. Add another <div> tag immediately within the <body> that
                    surround
                    > > > > the whole body,
                    > > > > 2. Set the div class attribute to yui-skin-sam and,
                    > > > > 3. Remove the class attribute in <body> tag
                    > > > >
                    > > > > I suppose there shouldn't be change in the layout. But I
                    realized the
                    > > > > width of the menubarItems have changed - some items has the
                    texts
                    > > > > overflow the width, and some underflow.
                    > > > >
                    > > > > So, how do I set the class "yui-skin-sam" properly for a
                    certain
                    > > > > portion of the page, but not the whole body?
                    > > > >
                    > > > >
                    > > > > Thanks for any feedback
                    > > > >
                    > > > I've had exactly the same problem trying to modify this example.
                    > > > I simply wrapped the whole menu in a new div, removed the class
                    name
                    > > > from the body tag and added it to my new wrapper div. After
                    setting
                    > > > the width on my new wrapper div to 700px all of the drop down
                    menu
                    > > > widths were all screwed up some way too wide some way to thin
                    so that
                    > > > the text overlapped the menu. It would be nice to know if
                    anyone has
                    > > > had and solved this issue.
                    > > >
                    > >
                    > >
                    >
                  • Eric Miraglia
                    bcarroll2k3, You can expect the 2.3.1 release within the next couple of weeks. Regards, Eric ______________________________________________ Eric Miraglia
                    Message 9 of 11 , Sep 10, 2007
                    • 0 Attachment
                      bcarroll2k3,

                      You can expect the 2.3.1 release within the next couple of weeks.

                      Regards,
                      Eric


                      ______________________________________________
                      Eric Miraglia
                      Yahoo! User Interface Library


                      On Sep 7, 2007, at 2:55 PM, bcarroll2k3 wrote:

                      Hi Todd,

                      Not trying to get you to commit to anything, but is the 2.3.1 release
                      going to be sooner than later? I ask because I've run into this same
                      problem. If not sooner, is there a workaround posted somewhere that
                      we can use? I checked the menu 'known issues' but didn't see
                      anything posted.

                      Thanks!

                      -B

                      --- In ydn-javascript@yahoogroups.com, Todd Kloots <kloots@...> wrote:
                      >
                      > This problem will be fixed in the upcoming 2.3.1 release of YUI.
                      >
                      > - Todd
                      >
                      > Caridy Patiño Mayea wrote:
                      > >
                      > > Hi,
                      > >
                      > > The problem is that the overlay's control uses a RENDER process to
                      > > create the DOM structure of the controls, and usually this
                      structure
                      > > is created over the document.body if you don't specify a DOM
                      element
                      > > in the render function:
                      > >
                      > > oMenu.render ( 'myCustomWrapper' );
                      > >
                      > > And then:
                      > >
                      > > <body>
                      > > <div class="yui-skin-sam">
                      > > // your page here...
                      > > </div>
                      > > <div class="yui-menu">
                      > > </div>
                      > > </body>
                      > >
                      > > As you see in the example... the CSS rule:
                      > >
                      > > .yui-skin-sam .yui-menu {
                      > > }
                      > >
                      > > will not be applied correctly. That's why you need to define the
                      > > yui-skin-sam to the body instead to use a DIV.
                      > >
                      > > Best Regards,
                      > > Caridy (caridy at gmail.com)
                      > > http://www.bubbling-library.com/ <http://www.bubbling-
                      library.com/>
                      > >
                      > > --- In ydn-javascript@yahoogroups.com
                      > > <mailto:ydn-javascript%40yahoogroups.com>, "Keith Frank"
                      <keith.frank@>
                      > > wrote:
                      > > >
                      > > > --- In ydn-javascript@yahoogroups.com
                      > > <mailto:ydn-javascript%40yahoogroups.com>, "jimmy_chu0807"
                      <chuj@> wrote:
                      > > > >
                      > > > > Referring to this example:
                      > > > >
                      > > >
                      > >
                      http://developer.yahoo.com/yui/examples/menu/topnavfrommarkupwithanim_
                      so\
                      > >
                      <http://developer.yahoo.com/yui/examples/menu/topnavfrommarkupwithanim
                      _so>>
                      > > > urce.html
                      > > > >
                      > > > > I was playing around with this example. Currently the <body>
                      tag is
                      > > > > belong to "yui-skin-sam" class. Now I:
                      > > > > 1. Add another <div> tag immediately within the <body> that
                      surround
                      > > > > the whole body,
                      > > > > 2. Set the div class attribute to yui-skin-sam and,
                      > > > > 3. Remove the class attribute in <body> tag
                      > > > >
                      > > > > I suppose there shouldn't be change in the layout. But I
                      realized the
                      > > > > width of the menubarItems have changed - some items has the
                      texts
                      > > > > overflow the width, and some underflow.
                      > > > >
                      > > > > So, how do I set the class "yui-skin-sam" properly for a
                      certain
                      > > > > portion of the page, but not the whole body?
                      > > > >
                      > > > >
                      > > > > Thanks for any feedback
                      > > > >
                      > > > I've had exactly the same problem trying to modify this example.
                      > > > I simply wrapped the whole menu in a new div, removed the class
                      name
                      > > > from the body tag and added it to my new wrapper div. After
                      setting
                      > > > the width on my new wrapper div to 700px all of the drop down
                      menu
                      > > > widths were all screwed up some way too wide some way to thin
                      so that
                      > > > the text overlapped the menu. It would be nice to know if
                      anyone has
                      > > > had and solved this issue.
                      > > >
                      > >
                      > >
                      >


                    • bcarroll2k3
                      Awesome, thank you :) ... release ... same ... that ... process to ... the ... http://developer.yahoo.com/yui/examples/menu/topnavfrommarkupwithanim_ ...
                      Message 10 of 11 , Sep 10, 2007
                      • 0 Attachment
                        Awesome, thank you :)

                        --- In ydn-javascript@yahoogroups.com, Eric Miraglia <miraglia@...>
                        wrote:
                        >
                        > bcarroll2k3,
                        >
                        > You can expect the 2.3.1 release within the next couple of weeks.
                        >
                        > Regards,
                        > Eric
                        >
                        >
                        > ______________________________________________
                        > Eric Miraglia
                        > Yahoo! User Interface Library
                        >
                        >
                        > On Sep 7, 2007, at 2:55 PM, bcarroll2k3 wrote:
                        >
                        > > Hi Todd,
                        > >
                        > > Not trying to get you to commit to anything, but is the 2.3.1
                        release
                        > > going to be sooner than later? I ask because I've run into this
                        same
                        > > problem. If not sooner, is there a workaround posted somewhere
                        that
                        > > we can use? I checked the menu 'known issues' but didn't see
                        > > anything posted.
                        > >
                        > > Thanks!
                        > >
                        > > -B
                        > >
                        > > --- In ydn-javascript@yahoogroups.com, Todd Kloots <kloots@>
                        wrote:
                        > > >
                        > > > This problem will be fixed in the upcoming 2.3.1 release of YUI.
                        > > >
                        > > > - Todd
                        > > >
                        > > > Caridy Patiño Mayea wrote:
                        > > > >
                        > > > > Hi,
                        > > > >
                        > > > > The problem is that the overlay's control uses a RENDER
                        process to
                        > > > > create the DOM structure of the controls, and usually this
                        > > structure
                        > > > > is created over the document.body if you don't specify a DOM
                        > > element
                        > > > > in the render function:
                        > > > >
                        > > > > oMenu.render ( 'myCustomWrapper' );
                        > > > >
                        > > > > And then:
                        > > > >
                        > > > > <body>
                        > > > > <div class="yui-skin-sam">
                        > > > > // your page here...
                        > > > > </div>
                        > > > > <div class="yui-menu">
                        > > > > </div>
                        > > > > </body>
                        > > > >
                        > > > > As you see in the example... the CSS rule:
                        > > > >
                        > > > > .yui-skin-sam .yui-menu {
                        > > > > }
                        > > > >
                        > > > > will not be applied correctly. That's why you need to define
                        the
                        > > > > yui-skin-sam to the body instead to use a DIV.
                        > > > >
                        > > > > Best Regards,
                        > > > > Caridy (caridy at gmail.com)
                        > > > > http://www.bubbling-library.com/ <http://www.bubbling-
                        > > library.com/>
                        > > > >
                        > > > > --- In ydn-javascript@yahoogroups.com
                        > > > > <mailto:ydn-javascript%40yahoogroups.com>, "Keith Frank"
                        > > <keith.frank@>
                        > > > > wrote:
                        > > > > >
                        > > > > > --- In ydn-javascript@yahoogroups.com
                        > > > > <mailto:ydn-javascript%40yahoogroups.com>, "jimmy_chu0807"
                        > > <chuj@> wrote:
                        > > > > > >
                        > > > > > > Referring to this example:
                        > > > > > >
                        > > > > >
                        > > > >
                        > >
                        http://developer.yahoo.com/yui/examples/menu/topnavfrommarkupwithanim_
                        > > so\
                        > > > >
                        > >
                        <http://developer.yahoo.com/yui/examples/menu/topnavfrommarkupwithanim
                        > > _so>>
                        > > > > > urce.html
                        > > > > > >
                        > > > > > > I was playing around with this example. Currently the
                        <body>
                        > > tag is
                        > > > > > > belong to "yui-skin-sam" class. Now I:
                        > > > > > > 1. Add another <div> tag immediately within the <body>
                        that
                        > > surround
                        > > > > > > the whole body,
                        > > > > > > 2. Set the div class attribute to yui-skin-sam and,
                        > > > > > > 3. Remove the class attribute in <body> tag
                        > > > > > >
                        > > > > > > I suppose there shouldn't be change in the layout. But I
                        > > realized the
                        > > > > > > width of the menubarItems have changed - some items has
                        the
                        > > texts
                        > > > > > > overflow the width, and some underflow.
                        > > > > > >
                        > > > > > > So, how do I set the class "yui-skin-sam" properly for a
                        > > certain
                        > > > > > > portion of the page, but not the whole body?
                        > > > > > >
                        > > > > > >
                        > > > > > > Thanks for any feedback
                        > > > > > >
                        > > > > > I've had exactly the same problem trying to modify this
                        example.
                        > > > > > I simply wrapped the whole menu in a new div, removed the
                        class
                        > > name
                        > > > > > from the body tag and added it to my new wrapper div. After
                        > > setting
                        > > > > > the width on my new wrapper div to 700px all of the drop
                        down
                        > > menu
                        > > > > > widths were all screwed up some way too wide some way to
                        thin
                        > > so that
                        > > > > > the text overlapped the menu. It would be nice to know if
                        > > anyone has
                        > > > > > had and solved this issue.
                        > > > > >
                        > > > >
                        > > > >
                        > > >
                        > >
                        > >
                        > >
                        >
                      Your message has been successfully submitted and would be delivered to recipients shortly.