PDA

View Full Version : Switch Menu II. The next step



ill_comms
04-09-2006, 02:27 PM
Hi, there was a post some time ago, http://www.dynamicdrive.com/forums/showthread.php?t=4190, asking how to collapse an expanded sub menu after another has been selected.

What I'm wondering is.. if it is possible to instead of making it collapse in one go make it slide back into place, as would normally happen if clicked on twice?

Have given this a fairly good shot myself and come up short! I'm just finding that when it disappears because you've selected a menu underneath the first one the one underneath shoots up the menu chain as the first collapses. It can be a little disorientating. Maybe there's another post asking the same thing that I've missed. Any help would be greatly appreciated! I have tried to reach Eric who created this menu at info@jswitch.com but to no avail the email address doesn't seem to exist anymore.

Maybe the only other thing I would like to see is some persistence in the way of a cookie but I'll come back with that if I can't sort it out myself, any examples would be great!

ill_comms
04-10-2006, 02:29 AM
For those interested, I have solved my own problem. I created a secondary bunch of variables to hold the values of the expanded sub menu. I then created a function similar to runSlide() called runSlide2() ha original eh! replacing all original variables with the secondary ones. I got rid of the if statement which determined if the sub menu was expanded or collapsed as it is always going to be expanded. New Code below highlighted blue. You may want to look at previous posts from jscheuer1 as he has suggested so other improvements.

I guess now it's on to the persistance via a cookie solution, again any help would be greatly appreciated!

function SetSlide()
{
subs = document.getElementsByTagName('DIV');

for (i = 0; i < subs.length; i++)
{
if (subs[i].className == 'subMenu' && subs[i].getAttribute("state", 0) != "0" && subs[i] !== OBJ_VIEW)
{
OBJ_VIEW2=subs[i];
OBJ_SLIDE2=subs[i].parentNode;
MainDiv2=subs[i].parentNode.parentNode;
NEW_PIX_VAL2 = MainDiv2.getAttribute("state");

if (window.TIMER_SLIDE2)
{
clearInterval(TIMER_SLIDE2);
}
TIMER_SLIDE2 = setInterval('RunSlide2()', DELAY_SLIDE);
}
}

if (window.TIMER_SLIDE)
{
clearInterval(TIMER_SLIDE);
}

if (TIMER_SLIDE == null && this.parentNode == MainDiv)
{
TIMER_SLIDE = setInterval('RunSlide()', DELAY_SLIDE);
}
else
{
RE_INIT_OBJ = this;
setTimeout('ReInit()', 200);
}
}

//Used when sliding or collapsing a menu when another menu option has been selected.
function RunSlide2()
{
OBJ_VIEW2.style.display = 'none';
NEW_PIX_VAL2 -= PIX_SLIDE;
if(NEW_PIX_VAL2 > 0)OBJ_SLIDE2.style.height = NEW_PIX_VAL2;

if (NEW_PIX_VAL2 <= 0)
{
NEW_PIX_VAL2 = 0;
OBJ_SLIDE2.style.height = NEW_PIX_VAL2
clearInterval(TIMER_SLIDE2);
TIMER_SLIDE2 = null;
OBJ_VIEW2.setAttribute("state","0")
MainDiv2.setAttribute("state",NEW_PIX_VAL2);
}
}

ill_comms
04-10-2006, 02:37 AM
For those interested, I have solved my own problem. I created a secondary bunch of variables to hold the values of the expanded sub menu. I then created a function similar to runSlide() called runSlide2() ha original eh! replacing all original variables with the secondary ones. I got rid of the if statement which determined if the sub menu was expanded or collapsed as it is always going to be expanded. New Code below highlighted blue.

I guess now it's on to the persistance via a cookie solution, again any help would be greatly appreciated!

function SetSlide()
{
subs = document.getElementsByTagName('DIV');

for (i = 0; i < subs.length; i++)
{
if (subs[i].className == 'subMenu' && subs[i].getAttribute("state", 0) != "0" && subs[i] !== OBJ_VIEW)
{
OBJ_VIEW2=subs[i];
OBJ_SLIDE2=subs[i].parentNode;
MainDiv2=subs[i].parentNode.parentNode;
NEW_PIX_VAL2 = MainDiv2.getAttribute("state");

if (window.TIMER_SLIDE2)
{
clearInterval(TIMER_SLIDE2);
}
TIMER_SLIDE2 = setInterval('RunSlide2()', DELAY_SLIDE);
}
}

if (window.TIMER_SLIDE)
{
clearInterval(TIMER_SLIDE);
}

if (TIMER_SLIDE == null && this.parentNode == MainDiv)
{
TIMER_SLIDE = setInterval('RunSlide()', DELAY_SLIDE);
}
else
{
RE_INIT_OBJ = this;
setTimeout('ReInit()', 200);
}
}

//Used when sliding or collapsing a menu when another menu option has been selected.
function RunSlide2()
{
OBJ_VIEW2.style.display = 'none';
NEW_PIX_VAL2 -= PIX_SLIDE;
if(NEW_PIX_VAL2 > 0)OBJ_SLIDE2.style.height = NEW_PIX_VAL2;

if (NEW_PIX_VAL2 <= 0)
{
NEW_PIX_VAL2 = 0;
OBJ_SLIDE2.style.height = NEW_PIX_VAL2
clearInterval(TIMER_SLIDE2);
TIMER_SLIDE2 = null;
OBJ_VIEW2.setAttribute("state","0")
MainDiv2.setAttribute("state",NEW_PIX_VAL2);
}
}