slashdot menu

I am intending to use a collapsible menu similar to that used at http://slashdot.org (left side) . I have a problem however :
I want the menu to expand immediately ON PAGE LOAD, without need to click on top bar


The package can be downloaded from http://www.dynamicdrive.com/dynamicindex1/slashdotmenu.zip

-----------------------------------
I have included the script below. CAN SOMEONE HELP AMMEND IT ? :


"
var remember = true; //Remember menu states, and restore them on next visit.
var contractall_default= false; //Should all submenus be contracted by default? (true or false)

var menu, titles, submenus, arrows, bypixels;
var heights = new Array();

var n = navigator.userAgent;
if(/Opera/.test(n)) bypixels = 2;
else if(/Firefox/.test(n)) bypixels = 3;
else if(/MSIE/.test(n)) bypixels = 2;

/////DD added expandall() and contractall() functions/////

function slash_expandall(){
if (typeof menu!="undefined"){
for(i=0; i<Math.max(titles.length, submenus.length); i++){
titles.className="title";
arrows.src = "slashfiles/expanded.gif";
submenus.style.display="";
submenus.style.height = heights+"px";
}
}
}

function slash_contractall(){
if (typeof menu!="undefined"){
for(i=0; i<Math.max(titles.length, submenus.length); i++){
titles.className="titlehidden";
arrows.src = "slashfiles/collapsed.gif";
submenus.style.display="none";
submenus.style.height = 0;
}
}
}


/////End DD added functions///////////////////////////////


function init(){
menu = getElementsByClassName("sdmenu", "div", document)[0];
titles = getElementsByClassName("title", "span", menu);
submenus = getElementsByClassName("submenu", "div", menu);
arrows = getElementsByClassName("arrow", "img", menu);
for(i=0; i<Math.max(titles.length, submenus.length); i++) {
titles.onclick = gomenu;
arrows.onclick = gomenu;
heights = submenus.offsetHeight;
submenus.style.height = submenus.offsetHeight+"px";
}
if(remember)
restore()
else if (contractall_default) //DD added code
slash_contractall() //DD added code
}

function restore() {
if(getcookie("menu") != null) {
var hidden = getcookie("menu").split(",");
for(var i in hidden) {
titles[hidden].className = "titlehidden";
submenus[hidden].style.height = "0px";
submenus[hidden].style.display = "none";
arrows[hidden].src = "slashfiles/collapsed.gif";
}
}
}

function gomenu(e) {
if (!e)
var e = window.event;
var ce = (e.target) ? e.target : e.srcElement;
var sm;
for(var i in titles) {
if(titles == ce || arrows[i] == ce)
sm = i;
}
if(parseInt(submenus[sm].style.height) > parseInt(heights[sm])-2) {
hidemenu(sm);
} else if(parseInt(submenus[sm].style.height) < 2) {
titles[sm].className = "title";
showmenu(sm);
}
}

function hidemenu(sm) {
var nr = submenus[sm].getElementsByTagName("a").length*bypixels;
submenus[sm].style.height = (parseInt(submenus[sm].style.height)-nr)+"px";
var to = setTimeout("hidemenu("+sm+")", 30);
if(parseInt(submenus[sm].style.height) <= nr) {
clearTimeout(to);
submenus[sm].style.display = "none";
submenus[sm].style.height = "0px";
arrows[sm].src = "slashfiles/collapsed.gif";
titles[sm].className = "titlehidden";
}
}

function showmenu(sm) {
var nr = submenus[sm].getElementsByTagName("a").length*bypixels;
submenus[sm].style.display = "";
submenus[sm].style.height = (parseInt(submenus[sm].style.height)+nr)+"px";
var to = setTimeout("showmenu("+sm+")", 30);
if(parseInt(submenus[sm].style.height) > (parseInt(heights[sm])-nr)) {
clearTimeout(to);
submenus[sm].style.height = heights[sm]+"px";
arrows[sm].src = "slashfiles/expanded.gif";
}


}

function store() {
var hidden = new Array();
for(var i in titles) {
if(titles[i].className == "titlehidden")
hidden.push(i);
}
putcookie("menu", hidden.join(","), 30);
}

function getElementsByClassName(strClassName, strTagName, oElm){
var arrElements = (strTagName == "*" && document.all)? document.all : oElm.getElementsByTagName(strTagName);
var arrReturnElements = new Array();
strClassName = strClassName.replace(/\-/g, "\\-");
var oRegExp = new RegExp("(^|\\s)" + strClassName + "(\\s|$)");
var oElement;
for(var i=0; i<arrElements.length; i++){
oElement = arrElements[i];
if(oRegExp.test(oElement.className)){
arrReturnElements.push(oElement);
}
}
return (arrReturnElements)
}

function putcookie(c_name,value,expiredays) {
var exdate=new Date();
exdate.setDate(exdate.getDate()+expiredays);
document.cookie = c_name + "=" + escape(value) + ((expiredays==null) ? "" : ";expires="+exdate);
}

function getcookie(c_name) {
if(document.cookie.length > 0) {
var c_start = document.cookie.indexOf(c_name + "=");
if(c_start != -1) {
c_start = c_start + c_name.length + 1;
var c_end = document.cookie.indexOf(";",c_start);
if(c_end == -1)
c_end = document.cookie.length;
return unescape(document.cookie.substring(c_start, c_end));
}
}
return null;
}

window.onload = init;
if(remember) window.onunload = store;

"[/i][/i][/i]

 

Try changing the second last line, i.e.

window.onload = init;

Code (markup):

to

window.onload = new Function("init();slash_expandall();");

Code (markup):

 

Sorry it didn't work. I need the menu to visibly slide open on page load , and not (appear open)

 

Try this. Might need some tweaking to interact with your init and onload, but it should (might?) work.

Add this function at the top of the file:

function expand_after_load()
{
     for (var sm in submenus)
          showmenu(sm);
}

Code (markup):

At the bottom of your page, right before you close </body>, put this:

  <script type="text/javascript">expand_after_load();</script>

Code (markup):

 

Thanks , but it made no difference