Hiermenus Go Forth, XXIII - DHTML Lab | 3 | WebReference

Hiermenus Go Forth, XXIII - DHTML Lab | 3


Hiermenus Go Forth, XXIII:
Version 4.1.1 - The Complete Script (Full-Window)

Since only IE5+ is affected by the memory problem, the only file that we have changed in HM4.1.1 is HM_ScriptDOM.js.

Tracking the Variables

Early in the script, we initialize an empty array to store all the relevant JS variables that we will create later, and create a function that will store any variable passed to it in the array.

if(HM_IE) {
    HM_a_ElementsCreated = [];
    function HM_f_StoreElement(el){
        HM_a_ElementsCreated[HM_a_ElementsCreated.length] = el;

In the HM_f_MakeElement() function, where all menu elements are created, we add a single statement that stores the menu element in our array:

function HM_f_MakeElement(menuid) {
    var MenuObject;
    MenuObject = document.createElement("DIV");


In the HM_f_MakeItemElement() function, where all item elements are created, we add similar statements to store the item element and any contained "more" image element:

function HM_f_MakeItemElement(menucount) {
    var ItemElement = document.createElement("DIV");

    if(ItemElement.hasImage) {
        var ImageElement = document.createElement("IMG");


Freeing Memory

At the end of our script, we place an onunload handler for IE users. If there is already an onunload handler assigned to the page, it is stored in HM_f_OtherOnUnload, in the same way that we store already assigned onload and onresize handlers.

When the user leaves the page, all JS variables that refer to elements are set to null. Then we cycle through the HM_a_ElementsCreated array, and set all properties of each element that refer to other elements to null. Finally any properties of the menu tree object are nulled.

Once this is done, any other onunload handler is executed by calling HM_f_OtherOnUnload().

if(HM_IE) {
    HM_f_OtherOnUnload = (window.onunload) ? window.onunload :  new Function;
    window.onunload = function(){
        HM_CurrentMenu = null;
        HM_CurrentItem = null;
        HM_CurrentTree.treeParent = null;
        HM_CurrentTree.startChild = null;
        var Eclength = HM_a_ElementsCreated.length;
        for(var i=Eclength-1; i>=0; i--){
            TempElement = HM_a_ElementsCreated[i];
            TempElement.parentMenu = null;
            TempElement.parentItem = null;
            TempElement.itemElement = null;
            TempElement.currentItem = null;
            TempElement.child = null;
            TempElement.siblingBelow = null;
            TempElement.imgLyr = null;
        TempElement = null;
        for(var i=0; i<HM_TotalTrees; i++) {
            HM_a_TopMenus[i].tree.startChild = null;
            HM_a_TopMenus[i].tree.treeParent = null;

Files Changed in Version 4.1.1

You will need to overwrite previous versions of the above file to upgrade to 4.1.1.

On the next page, the sample page included in the download.

Produced by Peter Belesis and

All Rights Reserved. Legal Notices.
Created: October 2, 2001
Revised: October 2, 2001

URL: http://www.webreference.com/dhtml/column59/3.html