SitePoint Sponsor

User Tag List

Page 1 of 2 12 LastLast
Results 1 to 25 of 40
  1. #1
    SitePoint Member
    Join Date
    Sep 2003
    Location
    melbourne
    Posts
    19
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    cbe and the x.js

    Okay so I'm a newbe to js, I don't really understand the syntax and all but I can nut a few things out with out to much trouble.

    I have been reworking our site www.vicnet.net.au, to a complete css layout design. everything been going great sitepoint and cssZengarden have been an inspiration. I have my dropdown menus working really nicely from the cde menu9.js wow that was great. So i go to tackle the footer placement issue with the x.js application. well I got that working to. But they don't work together. There must be some value that they both use because if I put the x.js on the bottom the footer appears but not the dropdown menu, if I swap it around the menu appears but not the footer.


    check it out at http://leon.vicnet.net.au/vicxml/index.html

    can any one help me out her! really hope so.

  2. #2
    Web-coding NINJA! silver trophy beetle's Avatar
    Join Date
    Jul 2002
    Location
    Dallas, TX
    Posts
    2,900
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Well, the author of those libraries, Mike Foster, is a member here, so hopefully he'll drop by soon!

    !! Paging MikeFoster -- Paging MikeFoster !!

    beetle a.k.a. Peter Bailey
    blogs: php | prophp | security | design | zen | software
    refs: dhtml | gecko | prototype | phpdocs | unicode | charsets
    tools: ide | ftp | regex | ffdev




  3. #3
    Team SitePoint AlexW's Avatar
    Join Date
    Apr 2000
    Location
    Melbourne
    Posts
    832
    Mentioned
    4 Post(s)
    Tagged
    0 Thread(s)
    Hi Leon,

    It's looking really good.

    I haven't looked at the intricacies of what you're doing, but CBE and X overlap functionality quite a bit and are very likely to step on each others toes while they're in the same file. While it may be possible to hack a method to get them both to work on this occasion, I think you would be best to select one and base your scripts around that library.

    X is more efficient and loads quicker. CBE is a little more friendly to work with if you're less familiar with JavaScript.

    Cutting out one library will eliminate the clash and a superfluous download at the same time
    Alex Walker
    SitePoint Developer
    SitePoint - Learnable

  4. #4
    SitePoint Member
    Join Date
    Sep 2003
    Location
    melbourne
    Posts
    19
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thanks Alex you have made a really good point. I have found the hack - they were both (of course) using the window.windowOnload function, one was cancelling the others variable - I just put them together and it fix it. But you are so right, their is now so much java script blot. I spend so long trying to save a k or 2 on my images but then add 20k of JavaScript's that and only uses 2 properties from it.now so much java script blot. I spend so long trying to save a k or 2 on my images but then add 20k of javascrpts that and only use 2 propertys from it.

  5. #5
    SitePoint Member
    Join Date
    Sep 2003
    Location
    melbourne
    Posts
    19
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Ha see my last post for WOW what a stutter

  6. #6
    Team SitePoint AlexW's Avatar
    Join Date
    Apr 2000
    Location
    Melbourne
    Posts
    832
    Mentioned
    4 Post(s)
    Tagged
    0 Thread(s)
    Exactly. I seem to remember CBE being about 150k or so, so that's a pretty fair saving if you can make it work with X.
    Alex Walker
    SitePoint Developer
    SitePoint - Learnable

  7. #7
    I'll take mine raw silver trophy MikeFoster's Avatar
    Join Date
    Dec 2002
    Location
    Alabama, USA
    Posts
    2,560
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hi Guys!

    Leon, the site looks great!

    The CBE core, event, and slide files total about 47K. All the files total about 70K, but you rarely need all of them in one app.

    X is about 15K. I wrote it after the experience of writing CBE. Unless you really need the extra features of CBE, I suggest using X.

    I'm working on a cascading menu similar to cbe menu9, but based on X. I'll be posting something about it here soon.

    But since you've already got the cbe menu implemented, a quick solution would be to just use cbe for the footer. I'll take a look at it and make some suggestions.


  8. #8
    I'll take mine raw silver trophy MikeFoster's Avatar
    Join Date
    Dec 2002
    Location
    Alabama, USA
    Posts
    2,560
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Try this for the adjustLayout function. Is there any more code that uses X?
    Code:
    function adjustLayout()
    {
      // inner elements
      var ct = cbeGetElementById("contenttest").cbe;
      var lt = cbeGetElementById("leftcoltest").cbe;
      var rt = cbeGetElementById("rightcoltest").cbe;
      var con = cbeGetElementById("container").cbe;
      // wrapper elements
      var c = cbeGetElementById("content").cbe;
      var l = cbeGetElementById("leftcol").cbe;
      var r = cbeGetElementById("rightcol").cbe;
      var f = cbeGetElementById("footer").cbe;
      // get max height
      var maxHeight = Math.max(ct.height(), Math.max(lt.height(), rt.height()));
      // set column heights
      c.height(maxHeight);
      l.height(maxHeight);
      r.height(maxHeight);
      // setup footer
      f.width(con.width());
      f.moveTo(0, maxHeight);
      f.zIndex(10);
      f.show();
    }

  9. #9
    SitePoint Member
    Join Date
    Sep 2003
    Location
    melbourne
    Posts
    19
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thankyou so much mike.
    I had not checked back for some time and was betting my head trying to get the syntax right for cbe it so nice now

    thanks again

    leon

  10. #10
    Team SitePoint AlexW's Avatar
    Join Date
    Apr 2000
    Location
    Melbourne
    Posts
    832
    Mentioned
    4 Post(s)
    Tagged
    0 Thread(s)
    Wow, there's service for you. Brilliant Mike
    Alex Walker
    SitePoint Developer
    SitePoint - Learnable

  11. #11
    I'll take mine raw silver trophy MikeFoster's Avatar
    Join Date
    Dec 2002
    Location
    Alabama, USA
    Posts
    2,560
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    You're very welcome, Leon.

    Thanks, Alex.

  12. #12
    SitePoint Member
    Join Date
    Sep 2003
    Location
    melbourne
    Posts
    19
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Thumbs up A sugestion for the x menus

    Sound so great that you are making an equivalent menu9 for the x.js Mike
    I have a suggestion for you.
    would you think it possible to have the menus run of nested unorded list instead of the div mark-up.

    The two problems with the divs are

    1 in order for the menus to make sense when downgraded you need to put h1 h2 h3 all over the shop.

    2 Also "bobby" does not like two links together with out something separating them so in order to get past bobby level 2 you need to put a fullstops after every link and then hide it with the stylesheet, witch then inturn puts big lumps of space between the links when downgraded and then fixing that problem.. blar blar..... it all starts getting messy.

    I would think that the mark up would look somthing like this

    <ul id="heading" >heading
    <li id="item">item</li>
    <li id="item">item</li>
    <ul id="heading" >heading
    <li id="item">item</li>
    <li id="item">item</li>
    </ul>
    <li id="item">item</li>
    </ul>


    Cheers Leon

  13. #13
    I'll take mine raw silver trophy MikeFoster's Avatar
    Join Date
    Dec 2002
    Location
    Alabama, USA
    Posts
    2,560
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hi Leon,

    xMenu3 is much better than cbeMenu9. It is very flexible - the html requirements are minimal.

    Quote Originally Posted by Leon
    1 in order for the menus to make sense when downgraded you need to put h1 h2 h3 all over the shop.
    Why? The labels already have their own css class - style them to look as you want.

    Quote Originally Posted by Leon
    2 Also "bobby" does not like two links together with out something separating them...
    Just apply a little left/right margin in the links' css.

    Quote Originally Posted by Leon
    would you think it possible to have the menus run of nested unorded list instead of the div mark-up.
    Yes. It might even work with almost no changes to the code - only change the html. The code really doesn't care what elements you use but it does make a few assumptions about how they are structured.

    But, using DIVs, if you apply left margin to each box then the downgraded menu will look just like a UL but without the dots. Go to the Hawk site, turn javascript off, and reload the page to see the menu downgraded.

    By "downgrade mode" I'm assuming that we still have CSS support. Without CSS support the menu may not be very pretty - but it is still completely accessible, as is all the other content. But I agree that, in this case, it would look better as a UL.

    So let's look at the possible html...
    Code:
    <ul id='myMenuName' class='xmBox myMenuBar'>
      <li class='xmLbl myMenuBarLbl'>barLabel</li>
      <ul class='xmBox myMenuBox'>
        <li><a>item</a></li>
        <li class='xmLbl myMenuBarLbl'>boxLabel</li>
        <ul class='xmBox myMenuBox'>
          <li><a>item</a></li>
        </ul>
      </ul>
    </ul>
    This should create a menu bar with one label (barLabel) which opens a box with one item and one label (boxLabel) which opens a box with one item.

    Hmmmm... this may be very easy to try out. In fact it could require no code changes - only html changes... I'm going to experiment with it.

    Thanks Leon, you've pointed out some things that I should have originally considered!

  14. #14
    I'll take mine raw silver trophy MikeFoster's Avatar
    Join Date
    Dec 2002
    Location
    Alabama, USA
    Posts
    2,560
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)


    Yes it works! All you have to change is the css and html.

  15. #15
    I'll take mine raw silver trophy MikeFoster's Avatar
    Join Date
    Dec 2002
    Location
    Alabama, USA
    Posts
    2,560
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I spoke too soon. IE has a problem with it, but it works in Opera and Firebird. Check out my test here.

    btw, the horizontal menu uses nested ULs and the vertical menu uses nested DIVs. They both use the same js and css.

    Edit:

    that menu demo now uses only DIVs, not ULs
    Last edited by MikeFoster; Sep 17, 2003 at 19:48.

  16. #16
    I'll take mine raw silver trophy MikeFoster's Avatar
    Join Date
    Dec 2002
    Location
    Alabama, USA
    Posts
    2,560
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Is my above xhtml valid? Or do the nested ULs have to be contained by the LIs, as below?
    Code:
    <ul id='xMenu1' class='xmBox myMenuBar'>
      <li class='xmLbl myMenuBarLbl'>barLabel
        <ul class='xmBox myMenuBox'>
          <li><a href=''>item</a></li>
          <li class='xmLbl myMenuBarLbl'>boxLabel
            <ul class='xmBox myMenuBox'>
              <li><a href=''>item</a></li>
            </ul>
          </li>
        </ul>
      </li>
    </ul>

  17. #17
    Web-coding NINJA! silver trophy beetle's Avatar
    Join Date
    Jul 2002
    Location
    Dallas, TX
    Posts
    2,900
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Mike, your XHTML is correct. Nested ULs have to be children to LIs, and cannot be children to other ULs.

    In fact, IE will render the improper correctly, but if you view the innerHTML with script, it will report a format like yours.
    beetle a.k.a. Peter Bailey
    blogs: php | prophp | security | design | zen | software
    refs: dhtml | gecko | prototype | phpdocs | unicode | charsets
    tools: ide | ftp | regex | ffdev




  18. #18
    I'll take mine raw silver trophy MikeFoster's Avatar
    Join Date
    Dec 2002
    Location
    Alabama, USA
    Posts
    2,560
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thanks Beetle!
    In fact, IE will render the improper correctly, but if you view the innerHTML with script, it will report a format like yours.
    Ah, that's why it's not working in IE.
    Mike, your XHTML is correct. Nested ULs have to be children to LIs, and cannot be children to other ULs.
    I was afraid of that. Leon that presents us with 2 problems. (1) The menu js assumes that a label and its box both have the same parent element - but now a box will be contained by its label. (2) It's nice to let the bar labels be inline for a horizontal menu bar - but now a box (block) will be contained by its label (inline). The result is that (1) I can't use the same js logic for both nested DIVs and nested ULs, and (2) it will take a re-design/re-write to support nested ULs.

    I'll be thinking about it

  19. #19
    SitePoint Member
    Join Date
    Sep 2003
    Location
    melbourne
    Posts
    19
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    thanks now for xmenu3

    Well thanks for all the effort Mike,
    My latency in replying is not because I'm ignoring you efforts it's because I'm in Australia.

    A question about xMenu3, when I checked it out it seemed necessary to click on the menu before the dropdowns would work, although after you click on one of the Parents all of them then work on the hover. is this intentional and can it be change?

    Cheers Leon

  20. #20
    I'll take mine raw silver trophy MikeFoster's Avatar
    Join Date
    Dec 2002
    Location
    Alabama, USA
    Posts
    2,560
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Yes it's intentional - I got tired of the menus popping up everytime I moved the mouse to the browser's menu or toolbar.

    Do you mean change it back to working strictly on mouseover? Yes it could be changed pretty easily.

  21. #21
    SitePoint Member
    Join Date
    Sep 2003
    Location
    melbourne
    Posts
    19
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Yep thats what I ment - cool I'm gonna try doing my menu in it today!

    cheers

  22. #22
    I'll take mine raw silver trophy MikeFoster's Avatar
    Join Date
    Dec 2002
    Location
    Alabama, USA
    Posts
    2,560
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I've been experimenting with implementing a dhtml cascading menu using standard nested ULs. I'm making progress. This is very experimental, but check it out if you want.

    xMenu4, using nested ULs

  23. #23
    Team SitePoint AlexW's Avatar
    Join Date
    Apr 2000
    Location
    Melbourne
    Posts
    832
    Mentioned
    4 Post(s)
    Tagged
    0 Thread(s)
    Nice idea. Everyone seems to be trying to make their nav out of restyled Lists. Very useful. Hawk is cool too. Love the way that nav sneaks in when your not paying attention.
    Alex Walker
    SitePoint Developer
    SitePoint - Learnable

  24. #24
    I'll take mine raw silver trophy MikeFoster's Avatar
    Join Date
    Dec 2002
    Location
    Alabama, USA
    Posts
    2,560
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thanks, Alex!

    Currently the UL menu experiment works with IE and Opera ... but not Mozilla - I wasn't expecting that, and it makes me suspicious.

  25. #25
    I'll take mine raw silver trophy MikeFoster's Avatar
    Join Date
    Dec 2002
    Location
    Alabama, USA
    Posts
    2,560
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    It's working with Moz now


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •