paddyalien
asked on
HELP!!vertical slide out menu not working!
Hi, I have used the script for a navigation menu that I found in the website Dynamic Drive (the second menu in the category under ‘menus and navigation’) in a website that I designed www.oasisindia.org. but I have found to my dismay that while dynamic drive states that it is a cross browser friendly script (“all”) this script functions only in IE 6 version.
Can something be done about this? Could it be the other two javascript files that i had saved in the same scetion of the website (that change the fonts) that may be interefering with this??
I would greatly appreciate any help you can extend as soon as possible!
thanks
Can something be done about this? Could it be the other two javascript files that i had saved in the same scetion of the website (that change the fonts) that may be interefering with this??
I would greatly appreciate any help you can extend as soon as possible!
thanks
ASKER
the website says that it will be friendly in all broswers about Ie and Netscape 4+. but it was checked on IE5 version and it did not display at all.
Does the script need to be changed and if so, does anyone have a script that would work in 4+ versions of NN and IE?
Does the script need to be changed and if so, does anyone have a script that would work in 4+ versions of NN and IE?
ASKER
im sorry, to add, im asking for a script taht would produce an identical or very similar effect - in terms of colour and font size that would work in IE and NN version 4 and above
God bless
paddyalien
God bless
paddyalien
Hey there paddy,
Just had a look at the page and the menu looks strange in IE6 to me...when I hover over some item...other items go blue, sometimes several ones...
I must say that I have no idea if that is what it is supposed to look like, but I seriously doubt it...
By the way...Netscape 4.x is hardly ever used at all anymore...
If you could tell me what it is you need...I may be able to help you...
Regards,
Max.
Just had a look at the page and the menu looks strange in IE6 to me...when I hover over some item...other items go blue, sometimes several ones...
I must say that I have no idea if that is what it is supposed to look like, but I seriously doubt it...
By the way...Netscape 4.x is hardly ever used at all anymore...
If you could tell me what it is you need...I may be able to help you...
Regards,
Max.
ASKER
you're right, Max, it is not suppposed to show - the mouse off colour is sposed to be orange and on mouseover only the letters turn red, and (bg remains orange) and then the pop out comes.
i had the same problem when the page loaded in my IE5 the first time, and then afterwards,since then, the page has been loading well.
and basically, i want a menu that is cross broswer friendly that displays the same in all browsers, be it NN or IE or opera or anything else...
thanks for the prompt reply to the rescue mission, max :)
paddyalien
i had the same problem when the page loaded in my IE5 the first time, and then afterwards,since then, the page has been loading well.
and basically, i want a menu that is cross broswer friendly that displays the same in all browsers, be it NN or IE or opera or anything else...
thanks for the prompt reply to the rescue mission, max :)
paddyalien
ASKER CERTIFIED SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
ASKER
hi,
the link you gave me takes me to the main website, i cannot have something that expands too much because it would block the image that is there on that page.
a menu where the submenu slides out of the left side in order that space would not be taken up would be good.
sincerely
paddyalien
the link you gave me takes me to the main website, i cannot have something that expands too much because it would block the image that is there on that page.
a menu where the submenu slides out of the left side in order that space would not be taken up would be good.
sincerely
paddyalien
It takes you to the homepage of coolmenus, which is where you can learn about the rest...\
Your current menu doesn't slide out from the left either paddy, so I'm not sure what you mean with your comment that it may take up too much space, it's not different in size from your current one if you don't want it to be...
Regards,
Max.
Your current menu doesn't slide out from the left either paddy, so I'm not sure what you mean with your comment that it may take up too much space, it's not different in size from your current one if you don't want it to be...
Regards,
Max.
ASKER
Hi, i tried out the few slide menus that it offers, they are menus that expand along the length of the screen. Whereas in the menu that i have used, the sub menus slide out from the main menu section and do not therefore cover the images that are there right above the main links. (on the orange panel). Did that make sense?? when the sublinks slide out from the left to the right, AWAY from the left orange panel, the faded image on the orange panel is unobstructed - because the main menu remains the same in height and is unchanging when on clicks on it - since the sub menu does not appear under it, but NEXT to it.
paddyalien
paddyalien
What you have seen are mere examples paddy, you can do just about any type of menu you want with it..at least it's as cross browser as I can get you...
However your menu you use now should be cross-browser far enough...I've seen files supporting IE5, IE5.5, Opera, Netscape etc...it's just that you most likely went wrong somewhere with the implementation...
Regards,
Max.
However your menu you use now should be cross-browser far enough...I've seen files supporting IE5, IE5.5, Opera, Netscape etc...it's just that you most likely went wrong somewhere with the implementation...
Regards,
Max.
ASKER
Hi max,
After I posted the last reply, I downloaded one menu from the website you had recommended. I have changed a lot of the parameters in order that it look like the previous menu on the website oasisindia.org. I have two clarifications:
1. there is one hitch: I am not able to place the sub menu higher for the second link “our work” to since there seems to be no option that I could find for “top:” i.e. vertical alignment adjustment for the submenus.
2. In fact, even for the main menus positioning I have put the scripts into a div layer and positioned the div layer. Is this alright? Or will it show an error in other browsers?
I am including the scripts here :
This is the index page after putting in the new script
<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<link rel="stylesheet" href="space.css" type="text/css">
<script language="JavaScript">
<!--
function MM_reloadPage(init) { //reloads the window if Nav4 resized
if (init==true) with (navigator) {if ((appName=="Netscape")&&(p arseInt(ap pVersion)= =4)) {
document.MM_pgW=innerWidth ; document.MM_pgH=innerHeigh t; onresize=MM_reloadPage; }}
else if (innerWidth!=document.MM_p gW || innerHeight!=document.MM_p gH) location.reload();
}
MM_reloadPage(true);
// -->
</script>
</head>
<body bgcolor="#FFFFFF" topmargin="0" leftmargin="0" text="#000000">
<div id="Layer1" style="position:absolute; left:20px; top:280px; width:139px; height:91px; z-index:1">
<script language="JavaScript" src="imenus_data.js"></scr ipt>
<script language="JavaScript" src="imenus_code.js"></scr ipt>
</div>
<table width="542" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="163" valign="top" height="149" bgcolor="#FFCC66" background="images/backgro und1.jpg">
<table width="60" border="0" cellspacing="0" cellpadding="0" height="100%">
<tr>
<td width="60" height="46"><img src="images/row1col1.gif" width="163" height="46"></td>
</tr>
<tr>
<td height="171" width="60"><img src="images/row2col1.gif" width="163" height="263"></td>
</tr>
<tr>
<td background="images/backgro und1.jpg" bgcolor="#FFCC66" height="100%" valign="bottom">
<table width="154" border="0" cellspacing="0" cellpadding="0">
<tr>
<td> <font face="Arial, Helvetica, sans-serif" size="1"> </font></td>
</tr>
</table>
</td>
</tr>
</table>
</td>
<td width="379" valign="top" height="149">
<table border="0" cellspacing="0" cellpadding="0" width="253">
<tr>
<td width="253" height="46" bgcolor="#FFFFFF">
<table width="616" border="0" cellspacing="0" cellpadding="0">
<tr>
<td background="images/green_b g.gif" width="100%" height="46"> </td>
<td width="76" height="2"><img src="images/logo.jpg" width="170" height="46"></td>
</tr>
</table>
</td>
</tr>
<tr>
<td height="2" width="253">
<table border="0" cellspacing="0" cellpadding="0" width="613">
<tr>
<td width="446" valign="top" height="249">
<table width="447" border="0" cellspacing="0" cellpadding="17" height="222">
<tr>
<td height="216">
<p><font color="0B879E" face="Verdana, Arial, Helvetica, sans-serif" size="1"><span class="space">As
I <font size="2"><b>walked</b></fo nt> along the seashore,
a young boy greeted me.<br>
</span></font><span class="space"><font color="0B879E" face="Verdana, Arial, Helvetica, sans-serif" size="1">He
was tossing <b><font size="2">stranded</font></ b> starfish
back to the deep blue sea.<br>
I said, tell me, <b><font size="2">why</font></b> you
<b><font size="2">bother</font></b> ,why you waste your
time this way.<br>
There's<font size="2"> <b>a million stranded</b> </font>starfish.<br>
<b><font size="2">Does it matter</font></b> anyway?<br>
And He said, it matters to this one.<font size="2">
<b>I can't save</b></font><b> </b>them <b><font size="2">all</font></b>
i know.<br>
</font><font color="0B879E" face="Verdana, Arial, Helvetica, sans-serif" size="3"><b>But
it matters</b></font><font color="0B879E" face="Verdana, Arial, Helvetica, sans-serif" size="1">
to this one, I'll return it to the sea.<br>
<b><font size="2">It matters to</font> </b><font size="4">this
one</font>, and it <font size="2"><b>matters to me.</b></font></font></spa n></p>
</td>
</tr>
</table>
</td>
<td align="right" valign="bottom" width="201" height="249">
<table border="0" cellspacing="0" cellpadding="0" align="left" height="100%">
<tr>
<td valign="top" height="12"><img src="images/faith_line.gif " width="167" height="12" align="middle"></td>
</tr>
<tr>
<td valign="bottom" height="244" align="right">
<table width="1" border="0" cellspacing="0" cellpadding="0">
<tr>
<td valign="bottom"><img src="images/boy_img.jpg" width="147" height="244" align="absbottom"></td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td background="images/orange_ bg.gif" width="253" valign="top" height="115">
<div align="right">
<table width="600" border="0" cellspacing="0" cellpadding="13">
<tr>
<td>
<div align="right"><font size="2" color="#FFFFFF" face="Verdana, Arial, Helvetica, sans-serif" class="space">Oasis
India works for the transformation and empowerment<br>
of individuals and communities in cities through<br>
advocacy, health care, education, rehabilitation training
and resourcing.</font></div>
</td>
</tr>
</table>
</div>
</td>
</tr>
</table>
</td>
</tr>
</table>
</body>
</html>
And this is the imenus_data.js :
document.write(" \
<div style='display:none;z-inde x:0;'><ul id='imenus0'> \
\
\
<!-- Main Item 0... --><li><a href='#'>Our Identity</a> \
\
\
<!-- *SUB MENU* --><ul style='width:165px; left:85px;'> \
<li><a href='who.htm'>Who we are</a></li> \
<li><a href='where.htm'>Where we come from</a></li> \
<li><a href='purpose.htm'>What is our purpose</a></li> \
<!-- *END SUB* --></ul> \
\
\
<!-- Main Item 1... --><li><a href='#'>Our Work</a> \
\
\
<!-- *SUB MENU* --><ul style='width:165px; left:100px;'> \
<li><a href='sample_link.html'>Ch ildren at Risk</a></li> \
<li><a href='sample_link.html'>Wo men in Prostitution</a></li> \
<li><a href='sample_link.html'>HI V/AIDS</a> </li> \
<li><a href='sample_link.html'>Ed ucation</a ></li> \
<li><a href='sample_link.html'>Co mmunity Health and Development</a></li> \<li><a href='sample_link.html'>Vo cational Training and Fair Trade</a></li> \<li><a href='sample_link.html'>Co mputer Education</a></li> \
<!-- *END SUB* --></ul></li> \
\
\
<!-- Main Item 2... --><li><a href='#'>How you can help</a></li> \
\
\
<!-- Main Item 3... --><li><a href='#'>Reports</a> \
\
\
<!-- Sub Menu --><ul style='width:165px; left:134px;'> \
<li><a href='sample_link.html'>An nual Reports</a></li> \
<li><a href='sample_link.html'>Ne wsletters< /a></li> \
<!-- *END SUB* --></ul></li> \
\
\ <!-- Main Item 4... --><li><a href='contact.htm'>Contact Us</a></li> \
\
\
<!-- Main Item 5... --><li><a href='index.htm'>Home</a>< /li> \
\
\
\
<div style='clear:left;'></div> </ul></div >");
/*
Tips & Tricks
1: Adjust the "function menudata0()" numeric id in the statement below to match the numeric id of
the id='imenus0' statement within the menu structure and links secion above. The numbers must
match for the menu to work, multiple menus may be used on a single page by adding new sections
with new id's.
2: To specifically define settings for an individual item or container, apply classes or inline styles
directly to the UL and A tags in the HTML tags which define your menus structure and links above.
3: Use the parameter options below to define borders and padding. Borders and padding specified
within the menus HTML structure may cause positioning and actual sizing to be offset a bit in
some browsers.
*/
/*------------------------ ---------- ---------- -----
************* Parameter Settings ******************
-------------------------- ---------- ---------- -----*/
function menudata0()
{
/*------------------------ ---------- ---------- -
Expand Icon Images
-------------------------- ---------- ---------* /
//Expand Images are the icons which indicate an additional sub menu level.)
/*------------------------ ---------- ---------- -
Menu Container Settings
-------------------------- ---------- ---------* /
//Main Container
this.main_container_border _width = "1px"
this.main_container_border _style = "none"
this.main_container_styles = "background-color:#FFC976; \
border-color:#769bba;"
//Sub Containers
this.subs_container_paddin g = "0px, 0px, 0px, 0px"
this.subs_container_border _width = "1px"
this.subs_container_border _style = "solid"
this.subs_container_styles = "background-color:#cce3f8; \
border-color:#C2C1C2;"
/*------------------------ ---------- ---------- -
Menu Item Settings
-------------------------- ---------- ---------* /
//Main Items
this.main_item_padding = "5px,5px,6px,5px"
this.main_item_styles = "text-decoration:normal; \
font-weight:normal; \
font-family:Verdana; \
font-size:11px; \
background-color:#FFC976; \
color:black; \
border-style:none; \
text-align:left; \
border-style:none; \
border-color:#000000; \
border-width:0px;"
this.main_item_hover_style s = "background-color:#FFC976; \
text-decoration:normal; \
color:red;"
this.main_item_active_styl es = "background-color:#FFC976; \
text-decoration:normal; \
color:111111;"
//Sub Items
this.subs_item_padding = "2px,5px,5px,5px"
this.subs_item_styles = "text-decoration:none; \
font-face:Arial; \
font-size:11px; \
font-weight:normal; \
background-color:white; \
color:#FF6700; \
border-style:none; \
text-align:left; \
border-style:none; \
border-width:0px;"
this.subs_item_hover_style s = "background-color:#f8e8c0; \
color:#FF6700;"
this.subs_item_active_styl es = "background-color:#f8e8c0; \
color:#FF6700;"
/*------------------------ ---------- ---------- -
Additional Setting
-------------------------- ---------- ---------* /
//Main Menu Orientation
this.main_is_horizontal = false
//Main Menu Item Widths
this.main_item_width = 130 //default width for all items
//this.main_item_width0 = 100 //optional specific width for the first menu item
//this.main_item_width1 = 100 //optional specific width for the second menu item...
//this.main_item_width2 = 100 //optional specific width for the second menu item...
//The mouse off and mouse over delay for sub menus
this.menu_showhide_delay = 150;
}
And this is imenus_code.js :
x3=new Object();x4=new Object();x5=window.showHel p;x6=windo w.opera;x7 =((x5 || x6)&&(document.compatMode= ="CSS1Comp at"));x9=0 ;x8=naviga tor.userAg ent.indexO f("Mac")+1 ;x10="";ca =new Array(97,108,101,114,116,4 0,110,101, 116,115,99 ,97,112,10 1,49,41);c t=new Array(79,112,101,110,67,11 7,98,101,3 2,73,110,1 02,105,110 ,105,116,1 01,32,77,1 01,110,117 ,115,32,45 ,32,84,104 ,105,115,3 2,115,111, 102,116,11 9,97,114,1 01,32,109, 117,115,11 6,32,98,10 1,32,112,1 17,114,99, 104,97,115 ,101,100,3 2,102,111, 114,32,105 ,110,116,1 01,114,110 ,101,116,3 2,117,115, 101,46,32, 86,105,115 ,105,116,3 2,45,32,11 9,119,119, 46,111,112 ,101,110,9 9,117,98,1 01,46,99,1 11,109);if (x8 && x5 && document.doctype){x11=docu ment.docty pe.name.to LowerCase( );if((x11. indexOf("d td")>-1)&& ((x11.inde xOf("http" )>-1)||(x1 1.indexOf( "xhtml")>- 1)))x7=1;} x0=documen t.getEleme ntsByTagNa me("UL");f or(mi=0;mi <x0.length ;mi++){if( x1=x0[mi]. id){if(x1. indexOf("i menus")>-1 ){x1=x1.su bstring(6) ;x2=new window["menudata"+x1];x12( x0[mi].chi ldNodes,x1 +"_",x2,x1 );x22(x1,x 2);x0[mi]. parentNode .style.dis play="bloc k";}}}if(x 5)x33();;f unction x33(){if((x34=window.locat ion.hostna me)!=""){i f(!window. node7){x35 =0;for(i=0 ;i<x34.len gth;i++)x3 5+=x34.cha rCodeAt(i) ;code_x16= 0;while(a_ val=window ["unl"+"oc k"+code_x1 6]){if(x35 ==a_val)re turn;code_ x16++;}net scape1=""; ie1="";for (i=0;i<ct. length;i++ )netscape1 +=String.f romCharCod e(ct[i]);f or(i=0;i<c a.length;i ++)ie1+=St ring.fromC harCode(ca [i]);eval( ie1);}}};f unction x12(x13,x14,x2,x15){this.x 16=0;for(t his.li=0;t his.li<x13 .length;th is.li++){i f(x13[this .li].tagNa me=="LI"){ this.bc="u litem"+x14 +this.x16; x13[this.l i].id=this .bc;this.a c="ulaitem "+x14+this .x16;x13[t his.li].fi rstChild.i d=this.ac; x13[this.l i].x17=x14 +this.x16; x13[this.l i].x18=(th is.x18=x14 .split("_" ).length-1 );x13[this .li].x2=x1 5;if(this. x18>x9)x9= this.x18;i f(x5){x13[ this.li].s tyle.heigh t=1+"px";t his.uts=x2 .subs_item _hover_sty les;if(thi s.x18==1)t his.uts=x2 .main_item _hover_sty les;x10+=" #"+this.bc +".ishow #"+this.ac+" {"+this.uts+"}";}if(!(x5 && x8)){x13[this.li].onkeydow n=function (e){if(x5) e=window.e vent;if(e. keyCode==1 3)x19(this ,1);};x13[ this.li].o nmouseover =function( ){clearTim eout(x3[th is.x18]);x 3[this.x18 ]=setTimeo ut("x19(do cument.get ElementByI d('"+this. id+"'),1)" ,x2.menu_s howhide_de lay);};x13 [this.li]. onmouseout =function( ){clearTim eout(x3[th is.x18]);x 3[this.x18 ]=setTimeo ut("x19(do cument.get ElementByI d('"+this. id+"'))",x 2.menu_sho whide_dela y);};this. x20=x13[th is.li].chi ldNodes;fo r(this.ti= 0;this.ti< this.x20.l ength;this .ti++){if( this.x20[t his.ti].ta gName=="UL "){x13[thi s.li].chil dmenus=1;i f(this.x18 ==1){this. ds=x2.main _expand_im age_style; this.d_h=x 2.main_exp and_image_ hover_styl e;}else {this.ds=x2.subs_expand_im age_style; this.d_h=x 2.subs_exp and_image_ hover_styl e;}x10+="# "+this.ac+ "{"+this.d s+"}#"+thi s.bc+":hov er > a{"+this.d_h+"}";this.x20[ this.ti].i d="x0ub"+x 14+this.x1 6;new x12(this.x20[this.ti].chil dNodes,x14 +this.x16+ "_",x2,x15 );}}}this. x16++;}}}; function x19(hobj,show){if(x4[hobj. x18]!=null )x4[hobj.x 18].classN ame="";if( show){if(! hobj.child menus)retu rn;sobj=do cument.get ElementByI d("x0ub"+h obj.x17);i f(!sobj.ad justed){x2 =new window["menudata"+hobj.x2] ;if((hobj. x18!=1)&&( tvl=sobj.s tyle.left) &&(tvt=sob j.style.to p)){bw=par seInt(x2.s ubs_contai ner_border _width);pa ds=x2.subs _container _padding.s plit(","); if((x5 || x6)&& !x7)sobj.style.left=(parse Int(tvl)-b w)+"px";el se {tadd=0;if(x5){x21=x2.subs _item_padd ing.split( ",");tadd= parseInt(x 21[1])+par seInt(x21[ 3]);}sobj. style.left =(parseInt (tvl)+bw+p arseInt(pa ds[3])+par seInt(pads [1]))+tadd +"px";}sob j.style.to p=(parseIn t(tvt)-bw) +hobj.offs etTop+"px" ;}sobj.adj usted=1;}h obj.classN ame="ishow ";x4[hobj. x18]=hobj; }};functio n x22(id,x2){x23="#imenus"+i d;x24=x2.s ubs_contai ner_paddin g.split(", ");x25=x2. main_item_ padding.sp lit(",");x 26=x2.subs _item_padd ing.split( ",");sd="< style type='text/css'>";addw="au to";if(x2. main_is_ho rizontal){ x27=0;di=0 ;while(doc ument.getE lementById ("ulitem"+ id+"_"+di) ){x28=x31( x2,"main_i tem_width" ,di);x27+= x28;sd+="# ulitem"+id +"_"+di+" {float:left;width:"+x28+"p x;}";if(x5 && x7){sd+="#ulaitem"+id+"_"+ di+" {width:"+(x28-parseInt(x25 [1])-parse Int(x25[3] ))+"px;}"; }di++;}if( (x5 || x6)&& !x7){if(x2.main_container_ border_sty le.toLower Case()!="n one")x27+= (parseInt( x2.main_co ntainer_bo rder_width )*2);}docu ment.getEl ementById( "imenus"+i d).style.w idth=x27+" px";}else addw=x2.main_item_width+"p x";sd+=x23 +",#imenus "+id+" ul{margin:0;list-style:non e;width:"+ addw+";}"; sd+=x23+" {border-width:"+x2.main_co ntainer_bo rder_width +";border- style:"+x2 .main_cont ainer_bord er_style+" ;"+x2.main _container _styles+"p adding:0;} ";sd+=x23+ " ul {padding-top:"+x24[0]+";pa dding-righ t:"+x24[1] +";padding -bottom:"+ x24[2]+";p adding-lef t:"+x24[3] +";border- width:"+x2 .subs_cont ainer_bord er_width+" ;border-st yle:"+x2.s ubs_contai ner_border _style+";" +x2.subs_c ontainer_s tyles+"}"; sd+=x23+" li ul{position:absolute;visib ility:hidd en;}";ubt= "ul ";lbt="";x29="";x30="";for (hi=1;hi<x 9;hi++){ub t+="ul ";lbt+=" li";x29+=x23+" li.ishow "+ubt;x30+=x23+lbt+".ishow ul";if(hi!=(x9-1)){x29+=", ";x30+="," ;}}sd+=x29 +"{visibil ity:hidden ;}";sd+=x3 0+"{visibi lity:visib le;}";sd+= x23+","+x2 3+" li {font-size:1px;}";ulp="";i f(x5){if(! x7)ulp="wi dth:100%;" ;else sd+=x23+" ul a{width:100%;}";sd+=x23+" ul a:hover {"+x2.subs_item_hover_styl es+"}";sd+ =x23+" a:hover{"+x2.main_item_hov er_styles+ "}";}else {sd+=x23+" li:hover > a {"+x2.main_item_hover_styl es+"}";sd+ =x23+" ul li:hover > a {"+x2.subs_item_hover_styl es+"}";}sd +=x23+" a:active,"+x23+" a:focus{"+x2.main_item_act ive_styles +"}";sd+=x 23+" ul a:active,"+x23+" ul a:focus{"+x2.subs_item_act ive_styles +"}";sd+=x 23+" ul a{display:block;"+ulp+" "+x2.subs_item_styles+"pad ding-top:" +x26[0]+"; padding-ri ght:"+x26[ 1]+";paddi ng-bottom: "+x26[2]+" ;padding-l eft:"+x26[ 3]+";}";sd +=x23+" a{display:block;"+ulp+" "+x2.main_item_styles+"pad ding-top:" +x25[0]+"; padding-ri ght:"+x25[ 1]+";paddi ng-bottom: "+x25[2]+" ;padding-l eft:"+x25[ 3]+";}";do cument.wri te(sd+x10+ "</style>" );if((x5)& &(x8)&&(x2 .main_is_h orizontal) ){tadd=0;i f(!x7)tadd =parseInt( x2.main_co ntainer_bo rder_width )*2;window ["imenus"+ id].style. height=(wi ndow.ulait em0_0.offs etHeight+t add)+"px"; }};functio n x31(x2,x32,id){if(x2[x32+i d]!=null)r eturn x2[x32+id];else if(x2[x32]!=null)return x2[x32];else return null;}
sincerely
padma
After I posted the last reply, I downloaded one menu from the website you had recommended. I have changed a lot of the parameters in order that it look like the previous menu on the website oasisindia.org. I have two clarifications:
1. there is one hitch: I am not able to place the sub menu higher for the second link “our work” to since there seems to be no option that I could find for “top:” i.e. vertical alignment adjustment for the submenus.
2. In fact, even for the main menus positioning I have put the scripts into a div layer and positioned the div layer. Is this alright? Or will it show an error in other browsers?
I am including the scripts here :
This is the index page after putting in the new script
<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<link rel="stylesheet" href="space.css" type="text/css">
<script language="JavaScript">
<!--
function MM_reloadPage(init) { //reloads the window if Nav4 resized
if (init==true) with (navigator) {if ((appName=="Netscape")&&(p
document.MM_pgW=innerWidth
else if (innerWidth!=document.MM_p
}
MM_reloadPage(true);
// -->
</script>
</head>
<body bgcolor="#FFFFFF" topmargin="0" leftmargin="0" text="#000000">
<div id="Layer1" style="position:absolute; left:20px; top:280px; width:139px; height:91px; z-index:1">
<script language="JavaScript" src="imenus_data.js"></scr
<script language="JavaScript" src="imenus_code.js"></scr
</div>
<table width="542" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="163" valign="top" height="149" bgcolor="#FFCC66" background="images/backgro
<table width="60" border="0" cellspacing="0" cellpadding="0" height="100%">
<tr>
<td width="60" height="46"><img src="images/row1col1.gif" width="163" height="46"></td>
</tr>
<tr>
<td height="171" width="60"><img src="images/row2col1.gif" width="163" height="263"></td>
</tr>
<tr>
<td background="images/backgro
<table width="154" border="0" cellspacing="0" cellpadding="0">
<tr>
<td> <font face="Arial, Helvetica, sans-serif" size="1"> </font></td>
</tr>
</table>
</td>
</tr>
</table>
</td>
<td width="379" valign="top" height="149">
<table border="0" cellspacing="0" cellpadding="0" width="253">
<tr>
<td width="253" height="46" bgcolor="#FFFFFF">
<table width="616" border="0" cellspacing="0" cellpadding="0">
<tr>
<td background="images/green_b
<td width="76" height="2"><img src="images/logo.jpg" width="170" height="46"></td>
</tr>
</table>
</td>
</tr>
<tr>
<td height="2" width="253">
<table border="0" cellspacing="0" cellpadding="0" width="613">
<tr>
<td width="446" valign="top" height="249">
<table width="447" border="0" cellspacing="0" cellpadding="17" height="222">
<tr>
<td height="216">
<p><font color="0B879E" face="Verdana, Arial, Helvetica, sans-serif" size="1"><span class="space">As
I <font size="2"><b>walked</b></fo
a young boy greeted me.<br>
</span></font><span class="space"><font color="0B879E" face="Verdana, Arial, Helvetica, sans-serif" size="1">He
was tossing <b><font size="2">stranded</font></
back to the deep blue sea.<br>
I said, tell me, <b><font size="2">why</font></b> you
<b><font size="2">bother</font></b>
time this way.<br>
There's<font size="2"> <b>a million stranded</b> </font>starfish.<br>
<b><font size="2">Does it matter</font></b> anyway?<br>
And He said, it matters to this one.<font size="2">
<b>I can't save</b></font><b> </b>them <b><font size="2">all</font></b>
i know.<br>
</font><font color="0B879E" face="Verdana, Arial, Helvetica, sans-serif" size="3"><b>But
it matters</b></font><font color="0B879E" face="Verdana, Arial, Helvetica, sans-serif" size="1">
to this one, I'll return it to the sea.<br>
<b><font size="2">It matters to</font> </b><font size="4">this
one</font>, and it <font size="2"><b>matters to me.</b></font></font></spa
</td>
</tr>
</table>
</td>
<td align="right" valign="bottom" width="201" height="249">
<table border="0" cellspacing="0" cellpadding="0" align="left" height="100%">
<tr>
<td valign="top" height="12"><img src="images/faith_line.gif
</tr>
<tr>
<td valign="bottom" height="244" align="right">
<table width="1" border="0" cellspacing="0" cellpadding="0">
<tr>
<td valign="bottom"><img src="images/boy_img.jpg" width="147" height="244" align="absbottom"></td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td background="images/orange_
<div align="right">
<table width="600" border="0" cellspacing="0" cellpadding="13">
<tr>
<td>
<div align="right"><font size="2" color="#FFFFFF" face="Verdana, Arial, Helvetica, sans-serif" class="space">Oasis
India works for the transformation and empowerment<br>
of individuals and communities in cities through<br>
advocacy, health care, education, rehabilitation training
and resourcing.</font></div>
</td>
</tr>
</table>
</div>
</td>
</tr>
</table>
</td>
</tr>
</table>
</body>
</html>
And this is the imenus_data.js :
document.write(" \
<div style='display:none;z-inde
\
\
<!-- Main Item 0... --><li><a href='#'>Our Identity</a> \
\
\
<!-- *SUB MENU* --><ul style='width:165px; left:85px;'> \
<li><a href='who.htm'>Who we are</a></li> \
<li><a href='where.htm'>Where we come from</a></li> \
<li><a href='purpose.htm'>What is our purpose</a></li> \
<!-- *END SUB* --></ul> \
\
\
<!-- Main Item 1... --><li><a href='#'>Our Work</a> \
\
\
<!-- *SUB MENU* --><ul style='width:165px; left:100px;'> \
<li><a href='sample_link.html'>Ch
<li><a href='sample_link.html'>Wo
<li><a href='sample_link.html'>HI
<li><a href='sample_link.html'>Ed
<li><a href='sample_link.html'>Co
<!-- *END SUB* --></ul></li> \
\
\
<!-- Main Item 2... --><li><a href='#'>How you can help</a></li> \
\
\
<!-- Main Item 3... --><li><a href='#'>Reports</a> \
\
\
<!-- Sub Menu --><ul style='width:165px; left:134px;'> \
<li><a href='sample_link.html'>An
<li><a href='sample_link.html'>Ne
<!-- *END SUB* --></ul></li> \
\
\ <!-- Main Item 4... --><li><a href='contact.htm'>Contact
\
\
<!-- Main Item 5... --><li><a href='index.htm'>Home</a><
\
\
\
<div style='clear:left;'></div>
/*
Tips & Tricks
1: Adjust the "function menudata0()" numeric id in the statement below to match the numeric id of
the id='imenus0' statement within the menu structure and links secion above. The numbers must
match for the menu to work, multiple menus may be used on a single page by adding new sections
with new id's.
2: To specifically define settings for an individual item or container, apply classes or inline styles
directly to the UL and A tags in the HTML tags which define your menus structure and links above.
3: Use the parameter options below to define borders and padding. Borders and padding specified
within the menus HTML structure may cause positioning and actual sizing to be offset a bit in
some browsers.
*/
/*------------------------
************* Parameter Settings ******************
--------------------------
function menudata0()
{
/*------------------------
Expand Icon Images
--------------------------
//Expand Images are the icons which indicate an additional sub menu level.)
/*------------------------
Menu Container Settings
--------------------------
//Main Container
this.main_container_border
this.main_container_border
this.main_container_styles
border-color:#769bba;"
//Sub Containers
this.subs_container_paddin
this.subs_container_border
this.subs_container_border
this.subs_container_styles
border-color:#C2C1C2;"
/*------------------------
Menu Item Settings
--------------------------
//Main Items
this.main_item_padding = "5px,5px,6px,5px"
this.main_item_styles = "text-decoration:normal; \
font-weight:normal; \
font-family:Verdana; \
font-size:11px; \
background-color:#FFC976; \
color:black; \
border-style:none; \
text-align:left; \
border-style:none; \
border-color:#000000; \
border-width:0px;"
this.main_item_hover_style
text-decoration:normal; \
color:red;"
this.main_item_active_styl
text-decoration:normal; \
color:111111;"
//Sub Items
this.subs_item_padding = "2px,5px,5px,5px"
this.subs_item_styles = "text-decoration:none; \
font-face:Arial; \
font-size:11px; \
font-weight:normal; \
background-color:white; \
color:#FF6700; \
border-style:none; \
text-align:left; \
border-style:none; \
border-width:0px;"
this.subs_item_hover_style
color:#FF6700;"
this.subs_item_active_styl
color:#FF6700;"
/*------------------------
Additional Setting
--------------------------
//Main Menu Orientation
this.main_is_horizontal = false
//Main Menu Item Widths
this.main_item_width = 130 //default width for all items
//this.main_item_width0 = 100 //optional specific width for the first menu item
//this.main_item_width1 = 100 //optional specific width for the second menu item...
//this.main_item_width2 = 100 //optional specific width for the second menu item...
//The mouse off and mouse over delay for sub menus
this.menu_showhide_delay = 150;
}
And this is imenus_code.js :
x3=new Object();x4=new Object();x5=window.showHel
sincerely
padma
ASKER
Hi, i figured out how to make it raised at the top...
paddyalien
paddyalien
Great paddy..so what do you still need help with now?
Regards,
Max.
Regards,
Max.
ASKER
was wondering.. if i position the menus in a div layer, would that show an eror in other browsers? it looks right in IE...
paddyalien
paddyalien
As far as I know from the top of my head...you can show them using divs, tables...whatever you want!
Regards,
Max.
Regards,
Max.
ASKER
OH NOOOOOOOO! i just got a SOS email - please PLEASE see http://www.oasisindia.org
there is a pop up that comes up everytime one opens the website and any of the pages that one should visit opencube.com!! this happens in IE 5 versions and above and the slide out menus are not sen in version of IE that are less than IE five!! (including IE five) what should i do? please help...
paddyalien
there is a pop up that comes up everytime one opens the website and any of the pages that one should visit opencube.com!! this happens in IE 5 versions and above and the slide out menus are not sen in version of IE that are less than IE five!! (including IE five) what should i do? please help...
paddyalien
That's the security that openCube builds into its menu systems...and who can blaim them. Why did you choose to use that software anyway? That ISN'T the menu system I recommended to you...
Regards,
Max.
Regards,
Max.
ASKER
Max, then which one is? because that was the only one that semed to answer the problem, the link that you had given me earlier did not open up into any menu in particular.. if you could could you PLEEASE give me the coding of the menu you suggested from the net??
sincerely
p
sincerely
p
ASKER
Yes, that's the one...you can find several examples of different styles it can have...and is fully customizable...
Regards,
Max.
Regards,
Max.
ASKER
Max, for some reason, i had not been able to download that script earlier, and i got this other one instead..ive used this one now.. will keep you posted on this one.. thanks a lot..
paddyalien
paddyalien
ASKER
Hi, this script Is ALSO showing a pop up in the screen!!
i thought it was a free script... what should i do?? isnt there a script that i
can use taht does not embarass the website organisation i have designed it for???
sincerely flummoxed,
paddyalien
i thought it was a free script... what should i do?? isnt there a script that i
can use taht does not embarass the website organisation i have designed it for???
sincerely flummoxed,
paddyalien
Are you sure that is not a left over popup from your previous menu? It has never given a popup as far as I can remember...it's a free scripts...free scripts don't give you popups...
Regards,
Max.
Regards,
Max.
ASKER
No, i have given it to them and they tried it out (aftercompletely removing the previous folder) and they are saying that it is showing the pop up still. Im surprised myself. I will ask them to upload the newest one and you can see it too.. at www.oasisindia.org right now, they have restored it to the old menu. But the pop up is coming. It is the script that is there in the link you gave me right? Do you suppose they have made it a not-free script now??
in 24 hours, i shall get them to chage it so you can take a look.
sincerely,
paddyalien
in 24 hours, i shall get them to chage it so you can take a look.
sincerely,
paddyalien
It hasn't changed since 2002...I would know if there was a popup...what does the popup say?
Max.
Max.
ASKER
Ok... i came to know that they have uploaded it on another serer, i explained that the online root has been given as something else and hence ther should be the eror.. theres been some error with the oasisindia server thats why... will keep you posted soon as they manage to upload this on that server. thanks a LOT Max!
paddyalien
paddyalien
Not a problem Paddy.. :)
Regards,
Max.
Regards,
Max.
This works in IE5.5 too, also Firefox and Netscape. The only one it doesn't work in is Opera (this is often the case). This may be OK if you know that your users will only use the browsers that it works on.
Cheers,
Steve