SitePoint Sponsor

User Tag List

Results 1 to 3 of 3
  1. #1
    SitePoint Addict
    Join Date
    May 2005
    Location
    Tauranga, New Zealand
    Posts
    357
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    multiple transmenu,how? plus: in ajax loaded content

    Hi,

    This is going to be a bit longer, becasue I would like to understand what I'm doing.

    The problem:
    I would like to place a transmenu (http://boring.youngpup.net/2004/transmenus) at two points into a page. One is a top level menu, which is already in the page. The second one is going to be in content that is being loaded by ajax.

    In researching how to do this, I have found a module for joomla that allows two transmenus in one page. I have made a sample page here that I would like to understand better. Can someone comment on how I understand the code:

    In this page: http://www.automatem.co.nz/transmenu...enuworking.htm

    what it does is:

    - includes some css (line 24 ff)
    - creates a hidden div with unique name (line 93)
    - sets up variables in the globally defined Transmenu object (line 117 ff) and declares a function initTransMenu()
    - creates a new Transmenu object and
    puts it into self['transmenu48254']. (line 158) This is something I don't quite understand. Is this the sames as document.getElementById('transmenu48254'). If so, how can it just overwrite the div structure with the Transmenu object?
    Or is self the same as the window object. Does that mean, this is just a new 'variable' named transmenu48253 in the window object?
    - runs all kind of function to create the menu and creates the html code for the menu (line 160 to 287)
    - links the initTransmenu function with the body onload event

    As I understand it, the trick is that the whole process is repeated further down and the second time a differently setup Transmenu is linked to the onload event, just because it is different at that time. Is that correct?

    So, what I want to do is in this page:
    http://www.automatem.co.nz/transmenu/index.html

    There is an animation which loads content when you click on the green button beside ANZ. The animation contains the javascript.

    What I thought I could do is to imitate the javascript as above, but link the function to some event in a nother hidden div, say onclick. At the end of the animation, I could then trigger the creation of the transmenu by calling mydiv.onclick()


    Thanks for any comments on the above, I'd like to understand how this works exactly.

    Jochen
    http://www.automatem.co.nz
    Websites, On-line Software and everything Internet
    Follow on Twitter | Connect on LinkedIn | Read on Posterous

  2. #2
    SitePoint Wizard
    Join Date
    Mar 2001
    Posts
    3,537
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Or is self the same as the window object.
    self and window are identical, and since self is confusing, don't use it in your code.

    Does that mean, this is just a new 'variable' named transmenu48253 in the window object?
    Yes. Every globlal name is a property of the window object. A global variable name is a name that is not declared inside a function. A global function name is the name of a function that is not defined inside another function.

    Global names can be referred to(or created) like this:

    window.theName

    or like this:

    window["theName"]

    Sorry, but that's all I have to comment on. I generally don't go looking around in the internals of frameworks. If you have questions about a specific framework, then you can try to contact the author or find a forum dedicated to that framework.

  3. #3
    SitePoint Addict
    Join Date
    May 2005
    Location
    Tauranga, New Zealand
    Posts
    357
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hi,

    thanks for your comments so far. I have managed to add additional entries to the transmenu and load these details with Ajax.

    Currently I seem to have only the following problem left, maybe you can comment on this:
    Transmenu constructs each dropdown menu as a table and then loops through them to determine their position by looking at the size. In the initial loop, the size of all menus is read correctly. When the additional menus are calculated, the offsetHeight property is 0.

    Can anyone comment in which cases this would be the case. Is this dependent on how the element or any of its parent elements is positioned? Or on the visibility of the element?

    Any comments are appreciated. I hagve uploaded a current version here, I understand that it would be quite difficult to look through the Transmenu code:
    http://www.automatem.co.nz/transmenu/index.html

    Thanks again for any help or pointers,

    Jochen
    http://www.automatem.co.nz
    Websites, On-line Software and everything Internet
    Follow on Twitter | Connect on LinkedIn | Read on Posterous


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
  •