JavaScript - Multilevel Menu Code Help Please
Greetings Everyone,
Feels good to be a part of such a community where i can clear my doubts and seek help. I need some help and advice in making a multilevel menu. I have the code for the menu(not multilevel) and it is as below: stm_bm(["uueoehr",400,"","scripts/blank.gif",0,"","",0,0,250,0,1000,1,0,0]); stm_bp("p0",[0,4,0,0,0,1,0,0,100,"",-2,"",-2,90,0,0,"#000000","#b6daff","",3,1,1,"#b6daff"]); stm_ai("p0i0",[0," Our Campus ","","",-1,-1,0,"","_self","","","","",0,0,0,"","",0,0,0,0,1,"#ffffff",0,"#ffff8f",0,"","",3,3,1,1,"#ffffff","#f fffff","#ff6600","#ff6600","bold 8pt Verdana","bold 8pt Verdana",0,0]); stm_bp("p1",[1,4,0,0,1,5,0,0,100,"",-2,"",-2,100,0,0,"#000000","#b6daff","",3,0,0,"#a2d0fc"]); stm_aix("p1i0","p0i0",[0,"About Us ","","",-1,-1,0,"about-us.aspx","_self","about-us.aspx","","","",0,0,0,"","",0,0,0,0,1,"#ffffff",0,"#ffff00",0,"","",3,3,0,0,"#fffff7","#fffff7"]); stm_aix("p1i1","p1i0",[0,"Campus Facilities","","",-1,-1,0,"about-us.aspx#campus","_self","about-us.aspx#campus"]); stm_aix("p1i2","p1i0",[0,"Accrediation","","",-1,-1,0,"about-us.aspx#acc","_self","about-us.aspx#acc"]); stm_aix("p1i3","p1i0",[0,"Contact Us","","",-1,-1,0,"contact.aspx","_self","contact.aspx"]); stm_ep(); stm_ai("p0i1",[6,1,"#b6daff","",0,0,0]); stm_aix("p0i2","p0i0",[0," Future Students "]); stm_bpx("p2","p1",[1,4,0,0,1,5,0,0,100,"",-2,"",-2,90]); stm_aix("p2i0","p1i0",[0,"Entry Requirement ","","",-1,-1,0,"entry-requirement.aspx","_self","entry-requirement.aspx"]); stm_aix("p2i1","p1i0",[0,"How to Apply","","",-1,-1,0,"apply.aspx","_self","apply.aspx"]); stm_aix("p2i2","p1i0",[0,"Fees & Charges ","","",-1,-1,0,"fee.aspx","_self","fee.aspx"]); stm_aix("p2i3","p1i0",[0,"Study at Gurkhas","","",-1,-1,0,"studying.aspx","_self","studying.aspx"]); stm_aix("p2i4","p1i0",[0,"Living in Australia","","",-1,-1,0,"living-australia.aspx","_self","living-australia.aspx"]); stm_aix("p2i5", "p1i0", [0, "Important Information", "", "", -1, -1, 0, "imp-info.aspx", "_self", "imp-info.aspx"]); stm_aix("p2i6", "p1i0", [0, "ESOS Framework", "", "", -1, -1, 0, "downloads/ESOS_FrameWork.pdf", "_blank", "download.aspx"]); stm_ep(); stm_aix("p0i3","p0i1",[]); stm_aix("p0i4","p0i0",[0," Current Students "]); stm_bpx("p3","p2",[]); stm_aix("p3i0","p1i0",[0,"Student Visa Obligations","","",-1,-1,0,"student-visa.aspx","_self","student-visa.aspx"]); stm_aix("p3i1","p1i0",[0,"Policies & Procedures","","",-1,-1,0,"policy.aspx","_self","policy.aspx"]); stm_aix("p3i12", "p1i0", [0, "Student Service ", "", "", -1, -1, 0, "student-service.aspx", "_self", "student-service.aspx"]); stm_ep(); stm_aix("p0i5","p0i1",[]); stm_aix("p0i6","p0i0",[0," Courses & Fees "]); stm_bpx("p4","p2",[]); stm_aix("p4i1", "p1i0", [0, "Business & Management", "", "", -1, -1, 0, "course-business.aspx", "_self", "course-business.aspx"]); stm_aix("p4i2", "p1i0", [0, "Accounting", "", "", -1, -1, 0, "course-finance.aspx", "_self", "course-finance.aspx"]); stm_aix("p4i3","p1i0",[0,"Hospitality","","",-1,-1,0,"course-hospitality.aspx","_self","course-hospitality.aspx"]); stm_aix("p4i4", "p1i0", [0, "Information Technology", "", "", -1, -1, 0, "course-information-technology.aspx", "_self", "course-information-technology.aspx"]); stm_aix("p4i5", "p1i0", [0, "ELICOS (English)", "", "", -1, -1, 0, "course-elicos.aspx", "_self", "course-elicos.aspx"]); stm_aix("p4i6", "p1i0", [0, "Short Courses", "", "", -1, -1, 0, "short-courses.aspx", "_self", "short-courses.aspx"]); stm_ep(); stm_aix("p0i7","p0i1",[]); stm_aix("p0i8","p0i0",[0," Photo Gallery ","","",-1,-1,0,"photo-gallery.aspx","_self","photo-gallery.aspx"]); stm_aix("p0i9","p0i1",[]); stm_aix("p0i11","p0i1",[]); stm_aix("p0i12","p0i0",[0," Downloads "]); stm_bpx("p5","p2",[]); stm_aix("p5i0","p1i0",[0,"Prospectus","","",-1,-1,0,"downloads/Student_prospectus_2009.pdf","_blank","download.aspx"]); The above menu is not multi level menu. Can anyone please help me with some code so that i can make it multilevel using the above menu code. Multilevel menu same like this -> http://www.dralexmarketing.com/artic...u_preview2.gif Similar TutorialsHello I have several issues with my multilevel drop down menu The First issue is : the page has 2 iframes (one has the horizontal multilevel drop down menu on the top) the below iframe has my site address Now, when i hover over the menu it does not open or expand but when i open just the menu without any iframes it does This clearly means that the menu is not coming out of the iframe Please help me bring it on top of everything of the page Note: i have placed the menu in one iframe and a page opens below it in another iframe. The Second issue is : I want the navigation bar that is the multilevel drop down menu to be editable Which means i have a blog and a forum on my site but my visitor wants that the blog should not appear there and another link to play games should be there and hence he/she can edit it And please also try to make it work on cookies so that the user info and preferences are saved in cookies and whenever he/she comes back they see the page their way. For you: I would like to tell you that IdeaLab has launched a Twitter Advertising, Widget and Search platform and the first 1000 people are getting $100 go to tweetup.com Please help me, it will be really appreciable. Thank you very much in advance! Could someone be kind enough to provide me with code to make a collapsible menu? What I'm looking for is a vertical menu, that will open up the sub-categories upon a mouseover. Clicking on the menu item will bring them to the specific page. Oh, and this might not matter, but I'd prefer if I was able to style the menu to fit with my site theme. Thanks.
Hello all. I need desperate help with this. The code below is two drop down menus where if you pick one of the values in the first drop down menu and pick the same exact value in the second drop down menu then it will give you an error stating that you can only select that value once. Example: if i choose T2 on the first drop down menu and select T2 on the second drop down it will print an error stating that you need to select another option. Here is where I need help. I want to have one of the drop down menus on one page named p1.html and have the other drop down on another page called p2.html. I need a solution on how to pass the information from the first drop down on p1.html to p2.html so it will know which was chosen on p1.html can anyone please help? Here is the code Code: <html> <title> hi </title> <head> </head> <body> First Choice: <select name="ThursAM_First" size="1" id="ThursAM_First" onchange="return no_dupes(this,ThursAM_Second)"> <option value="" selected>• choose •</option> <option value=""></option> <option value="T1">T1</option> <option value="T2">T2</option> <option value="T3">T3</option> <option value="T4">T4</option> </select> Second Choice: <select name="ThursAM_Second" size="1" id="ThursAM_Second" onchange="return no_dupes(this,ThursAM_First)"> <option value="" selected>• choose •</option> <option value=""></option> <option value="T1">T1</option> <option value="T2">T2</option> <option value="T3">T3</option> <option value="T4">T4</option> </select> </html> <script type="text/javascript" src="new.js"></script> Here is the javascript code that will give you an error if you select the same value twice... Code: function no_dupes(oSelect, oSelect2) { var selval = oSelect.options[oSelect.selectedIndex].v… var opt, i = 0; while (opt = oSelect2.options[i++]) if (opt.value && !opt.defaultSelected && (opt.selected && opt.value == selval)) { alert("\n Sorry, you already choose this point value for round 1. Please select another!\nThanks."); oSelect.selectedIndex = 0; return false; } } I may need to use a cookie but I have no idea how to that. Thank you all!!! Please where do I need to look to find such a script? I’ve been looking for 3 days now and I can’t find something that will have all of those. I need a floating horizontal dropdown menu, and submenu with mouse over description of the site. EX: menu 1 On the road ------- --------Restaurant .... .... ... .... ... .... .... .... ... .Mama house (home made cooking) .... .... ... .... ... .... .... .... ... .All fast food (only fast food get carb) .... .... ... .... ... Motel .... .... ... .... ... .... .... .... ... .No fleas motel (bugs free motel) .... .... ... .... ... .... .... .... ... .Pet free ( no pet allowed) Car rental Well I am sure you get the ideal. Where do I need to look or what would be the kind of scrip for that ? Java, html, css…. Please tell me to find the proper code for what I need. thanks Hi I'm pretty new to javascript.. infact very new, only 4 days old , and I'm like this --> Anyway, I want to add a link in this menu . I want the link to be where the text " Go to the front page, Want to know more about us?, Keep in touch with us, call any time you want " How do I do that? cheers! here's the page : http://www.mts-photo.com/fotter_nav.html Code: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> <title>Jquery Tutorial : Horizontal animated menu</title> <link type="text/css" href="css/menu.css" rel="stylesheet" media="screen" /> <script type="text/javascript" src="inc/jquery.js"></script> <script type="text/javascript" src="inc/menu.js"></script> </head> <body> <div id="wrapper"> <ul id="menu"> <li><a href="test.html" title="Go to the front page", >Home</a> </li> <li><a href="#" title="Want to know more about us?">About Us</a></li> <li><a href="#" title="Keep in touch with us, call any time you want">Contact Us</a></li> <li><a href="#" title="Ny link">Nylink 1</a></li> </ul> </div> </body> </html> I've been trying to figure this out for quite a while now and I am at the end of my rope here. Ok a guy wanted me to edit the template to his ZenCart installation, this is no big deal as I am a graphics guy with a tiny bit of knowledge for actually doing websites. He wants a popup menu on the top he says later and the list he gave had like 37 links...lol I didn't want to write all that out - so I bought a program that makes the menu and you just insert the code. (This works fine if I insert it into a normal html file) So I get these instructions from the program - copy this code and insert it into the webpage: Code: <script language="javascript">var MenuFolderName="";</script><script charset="UTF-8" language="javascript" src="sftmp6arrays.js"></script><script charset="UTF-8" language="javascript" src="sfmenutmp6ie.js"></script> To copy two generated files to the web directory: sftmp6arrays.js sfmenutmp6ie.js That is it. Except - ZenCart is apparently more frustrating than my girlfriend. So I find out I need to put all the JS files in a jscript folder of the template. Then I need to paste the code above into a file and save it as jscript_topmenu.js I find out - that a file called "html_header.php" makes the site load all javascript. This template doesn't have it - so I copy that file from another template and put it in the template/common/ folder. And nothing is happening. Even if I dance in circles and say magic words...nothing happens. I swear. I'm going bald. So look - I presume that I need to call that script in the tpl_header.php file but I don't know how. Then I read that I also need to get rid of the <script> </script> stuff in the js file mentioned above. I am so confused. Can someone please tell me - the idiot <- that's me so talk to me like one so I get it please. - what I need to do. I will cook you grilled cheese. I will do whatever it takes. Please put an end to this misery. Please. Thanks. Hi Everyone, I have a small doubt in jsp coding..I want to disable certain links on user login.These links come under a menu list. Clarifying more on this..I have created a web application which has got a login page..After login it redirects me to my home page..now when an administrator logs in he/she should be able to view all links on the menu list whereas when an user logs in he/she should only view a certain number of links based on his/her privileges..how can i write this code. Can anyone help me?? Its really really urgent!!!!!!!!!! please................ basically i have a form with lots of fields.. drop down boxes and textarea's and standard input text.. now what i need is a way to change all of these fields with a fetch button. i can get the value for the fields from the perl script on my server side. the form basicslly sends lots of fields to my perl script and saves each field of data into seperate text docs. now my customer would like to retrieve the data back to the form to change aspects of it to be resubmitted . i am struggling with the simplist of codes to set the value of the fields from a javascript variable any ideas please. I am using this fancy box code to smoothly pop up an image on click, I got it working on my main index page but that's not where I want to put it. My site has a menu where it loads webpages inside the main index one, I would like to use the code on one of those pages but something is not working. I am not able to use the specified DOCTYPE but find that it works all the same with my current one, however if I use the given one in addition to the one I have now (and need) then my site does not work properly, further if I replace it I get the same results. My existing doctype: Code: <DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd" "http://www.w3.org/TR/1999/REC-html401-19991224/loose.dtd" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> What the code uses: Code: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> I'm not sure what the differences are but I've been advised that I need to run the code in "standards mode" before I try to fix it. As I see it the code works, just not where I need it to, nothing unusual on my site and nothing unusual that I may be wrong. On my site you can see at the bottom right a blue text link called "aaaa" this is the code that works, however (clicking the dome to the left of that to scroll the page down and selecting the "met.a has guts" menu option diagram) you'll see the "aaaa" link again at the bottom left of that page and that is where I need it to work from. I even tried using the exact code from the example in that linked .htm page but it doesn't make a difference, it probably even hinders the code as it looks at the main html page. But if loading the page on its own the code will work, so its related to the menu and the way that works. If anybody can help that would be brilliant, I'm sure its something simple. Thanks! Hi Exprts, I am using a (anylink)javascript menu from dynamic drive. Basically I am having a design issue but posting the problem here because I think this can be fixed through JS. Please download the attached files. You will see the menu & the sub menu on mouse over. Problem is that.... when the submenu appears & I take my mouse to the sub menu, the parent item hover style disappears. I mean, it doesn't look active. I just want the parent item active when users moves his/her mouse to sub menu. Thats all. Please suggest me any solutions for this. Thank you in advance. Hi all, this is my first post so forgive me for any errors but i'll try and give all the information i can. i use Xara Designer Pro and i have used a 3rd party software to create a html menu however i have a html loading screen on my site and the menu always appears on top of the screen and while the screen is loading, this is the only thing that appears on top everything else is fine, i have put this to the people on the xara forums and the opinion is that its probably the JS file that the menu is using that is telling it to appear on top. i was wondering what i should look for to determin this problem or if someone could take a look at it for me? i'll upload the JS here and see if anyone can help. my site is at www.pcevo.co.uk however you need to CTRL + F5 to refresh wihtout the cache to see the loading screen if you are on a fast connection.
I'm creating a menu using html, css and a javascript, I found a tutorial to follow online. What I am trying to achieve is when the mouse hovers over the menu items, each item will have a different colour background. the problem is that i can do this but it only works with one colour and not different colours. this is the html: Code: <ul> <li><a href="1.php">Things</a></li> <li><a href="2.php">Animals</a> <ul> <li><a href="2-1.php">Cani</a> <ul> <li><a href="2-1-1.php">Domestic dogs</a></li> <li><a href="2-1-2.php">Wolves</a></li> </ul> </li> <li><a href="2-2.php">Felidae</a> <ul> <li><a href="2-2-1.php">Domestic cats</a></li> <li><a href="2-2-2.php">Wild cats</a></li> </ul> </li> </ul> </li> <li><a href="3.php">Humans</a></li> </ul> the css is as follows: Code: div#s1 { width: 200px; /* menu width */ } div#s1 ul { background-color: #036; list-style-type: none; /* get rid of the bullets */ padding:0; /* no padding */ margin:0; /* no margin for IE either */ } div#s1 ul li { margin: 0; padding: 0; background-color: #036; display:block; border-top: 1px solid white; /* lines */ } div#s1 ul li a { display: block; /* lines extend to right, make area clickable */ color: white; background-color: #036; padding: 3px 3px 3px 23px; margin:0; text-decoration: none; height:15px; /* hint for IE, alternatively remove whitespace from HTML */ } div#s1 ul ul li a { margin-left: 20px; /* indent level 1 */ } div#s1 ul ul ul li a { margin-left: 40px; /* indent level 2 */ } div#s1 ul ul ul ul li a { margin-left: 60px; /* indent level 3 */ } div#s1 li ul, div#s1 li.open li.closed ul { display: none; /* collapse */ } div#s1 li.open ul { display: block; /* expand */ } div#s1 ul li.open a { background-image: url(bullet_open.gif); background-repeat: no-repeat; } div#s1 ul li.closed a { background-image: url(bullet_closed.gif); background-repeat: no-repeat; } div#s1 ul li.leaf a { background-image: url(bullet_leaf.gif); background-repeat: no-repeat; } div#s1 li.active a { background-position: 0px -20px; color: red; /* highlight text */ } div#s1 li.active li a { background-position: 0px 0px; color: white; /* fix lower levels */ } div#s1 ul li a:hover { color: red; background-color: #06C; /* rollover effect */ } and finally the javascript: Code: var menu_active_class = "active"; var menu_leaf_class = "leaf"; var menu_open_class = "open"; var menu_closed_class = "closed"; //the default page that is displayed if URL ends in / var menu_default_page = "index.php"; var menu_url; //main function //menu_id : id of the element containing the navigation function menu_main(menu_id) { var url = location.href; if (url.lastIndexOf("/") == (url.length-1)) { url = url+menu_default_page; } if (url.lastIndexOf("?") >= 0) { url = url.substring(0, url.lastIndexOf("?")); } if (url.lastIndexOf("#") >= 0) { url = url.substring(0, url.lastIndexOf("#")); } menu_url = url; var main = document.getElementById(menu_id); if (!main) alert("No element with id '"+ menu_id +"' found"); menu_traverse(main); } /* Walks down the subtree and on the way back sets properties. returns bit set 1: set = element is a node, unset = element is a leaf 2: set = element contains the active node 4: set = element is the active A node */ function menu_traverse(element) { var props = 0; // walk down for (var i=0; i<element.childNodes.length; i++) { var child = element.childNodes[i]; props |= menu_traverse(child); // aggregate bits } // on the way back now switch (element.tagName) { case "UL": props |= 1; break; case "LI": var c1 = (props & 1) ? ((props & (2|4)) ? menu_open_class : menu_closed_class) : menu_leaf_class; element.className = element.className ? element.className+" "+c1 : c1; if (props & 4) { if (!(props & 2)) element.className += " "+menu_active_class; props |= 2; props &= 1 | 2; // reset bit 4 } break; case "A": if (props & 2) break; // once is enough var href = element.getAttribute("href"); if (menu_isSameUrl(menu_url, href)) props |= 4; break; } return props; } //matches two URIs when href is the last part of url //.. and . are correctly resolved function menu_isSameUrl(url, href) { var a = url.split(/[?\/]/i); var b = href.split(/[?\/]/i); var i = a.length - 1; var j = b.length - 1; while ((i >= 0) && (j >= 0)) { if (b[j] == "..") { j-=2; continue; } if (a[i] == "..") { i-=2; continue; } if ((b[j] == ".") || (b[j] == "")) { j--; continue; } if ((a[i] == ".") || (a[i] == "")) { i--; continue; } if (! (a[i] == b[j])) return false; i--; j--; } return true; } New to this forum but hope this will explain my problem, any help is much appreciated! thanks!! Jesper I am having trouble with a sub-menu of the 1st item only and can not seem to figure it out. All the others are fine. Any help is appreciated. Here is the code: var NoOffFirstLineMenus=7; // Number of first level items var LowBgColor='white'; // Background color when mouse is not over var LowSubBgColor='white'; // Background color when mouse is not over on subs var HighBgColor='black'; // Background color when mouse is over var HighSubBgColor='black'; // Background color when mouse is over on subs var FontLowColor='black'; // Font color when mouse is not over var FontSubLowColor='black'; // Font color subs when mouse is not over var FontHighColor='white'; // Font color when mouse is over var FontSubHighColor='white'; // Font color subs when mouse is over var BorderColor='black'; // Border color var BorderSubColor='black'; // Border color for subs var BorderWidth=1; // Border width var BorderBtwnElmnts=1; // Border between elements 1 or 0 var FontFamily="arial,comic sans ms,technical" // Font family menu items var FontSize=9; // Font size menu items var FontBold=1; // Bold menu items 1 or 0 var FontItalic=0; // Italic menu items 1 or 0 var MenuTextCentered='center'; // Item text position 'left', 'center' or 'right' var MenuCentered='center'; // Menu horizontal position 'left', 'center' or 'right' var MenuVerticalCentered='top'; // Menu vertical position 'top', 'middle','bottom' or static var ChildOverlap=.2; // horizontal overlap child/ parent var ChildVerticalOverlap=.2; // vertical overlap child/ parent var StartTop=05; // Menu offset x coordinate var StartLeft=05; // Menu offset y coordinate var VerCorrect=0; // Multiple frames y correction var HorCorrect=0; // Multiple frames x correction var LeftPaddng=3; // Left padding var TopPaddng=2; // Top padding var FirstLineHorizontal=1; // SET TO 1 FOR HORIZONTAL MENU, 0 FOR VERTICAL var MenuFramesVertical=1; // Frames in cols or rows 1 or 0 var DissapearDelay=1000; // delay before menu folds in var TakeOverBgColor=1; // Menu frame takes over background color subitem frame var FirstLineFrame='navig'; // Frame where first level appears var SecLineFrame='space'; // Frame where sub levels appear var DocTargetFrame='space'; // Frame where target documents appear var TargetLoc=''; // span id for relative positioning var HideTop=0; // Hide first level when loading new document 1 or 0 var MenuWrap=1; // enables/ disables menu wrap 1 or 0 var RightToLeft=0; // enables/ disables right to left unfold 1 or 0 var UnfoldsOnClick=0; // Level 1 unfolds onclick/ onmouseover var WebMasterCheck=0; // menu tree checking on or off 1 or 0 var ShowArrow=1; // Uses arrow gifs when 1 var KeepHilite=1; // Keep selected path highligthed var Arrws=['tri.gif',5,10,'tridown.gif',10,5,'trileft.gif',5,10]; // Arrow source, width and height function BeforeStart(){return} function AfterBuild(){return} function BeforeFirstOpen(){return} function AfterCloseAll(){return} // Menu tree // MenuX=new Array(Text to show, Link, background image (optional), number of sub elements, height, width); // For rollover images set "Text to show" to: "rollover:Image1.jpg:Image2.jpg" Menu1=new Array("Home","","",3); Menu1_1=new Array("The Ayllu","The Ayllu.htm","",0,20,150); Menu1_2=new Array("Acknow","Acknowledgement.htm","",0); Menu1_3=new Array("Prayer","Prayer.htm","",0); Menu2=new Array("About Us","","",4); Menu2_1=new Array("Debra","bio.htm","",0,20,150); Menu2_2=new Array("Seamus","Seamus.htm","",0); Menu2_3=new Array("Locations","location.htm","",0); Menu2_4=new Array("Contact Us","contact.htm","",0); Menu3=new Array("Services","","",7); Menu3_1=new Array("Shamanic Healing","http://www.Ayllu.us/Shamanic Healing.htm","",0,20,150); Menu3_2=new Array("Shamanic Counseling","http://www.Ayllu.us/Shamanic Counseling.htm","",0); Menu3_3=new Array("Sacred Ceremonies","http://www.Ayllu.us/Sacred Ceremonies.htm","",0); Menu3_4=new Array("Sacred Body Work","http://www.Ayllu.us/sbw.htm","",0); Menu3_5=new Array("Full Moon Crystal Bowl","http://www.Ayllu.us/fm.htm","",0); Menu3_6=new Array("Sound Healing","http://www.Ayllu.us/Sound Healing.htm","",0); Menu3_7=new Array("LaHo-Chi","http://www.Ayllu.us/lahochi.htm","",0); Menu4=new Array("Calendar","http://www.ayllu.us/calendar.htm","",0); Menu5=new Array("Gallery","http://www.ayllu.us/gallery.html","",0); Menu6=new Array("Articles","","",3); Menu6_1=new Array("Test 1","http://www.Ayllu.us/blank.htm","",0,20,150); Menu6_2=new Array("Test 2","http://www.Ayllu.us/blank.htm","",0); Menu6_3=new Array("Test 3","http://www.Ayllu.us/blank.htm","",0); Menu7=new Array("Links","http://www.ayllu.us/links.htm","",0); ? how would i make it for a menu so you could press it and it would go down to click on a link.
This post will contain a few guidelines for what you can do to get better help from us. Let's start with the obvious ones: - Use regular language. A spelling mistake or two isn't anything I'd complain about, but 1337-speak, all-lower-case-with-no-punctuation or huge amounts of run-in text in a single paragraph doesn't make it easier for us to help you. - Be verbose. We can't look in our crystal bowl and see the problem you have, so describe it in as much detail as possible. - Cut-and-paste the problem code. Don't retype it into the post, do a cut-and-paste of the actual production code. It's hard to debug code if we can't see it, and this way you make sure any spelling errors or such are caught and no new ones are introduced. - Post code within code tags, like this [code]your code here[/code]. This will display like so: Code: alert("This is some JavaScript code!") - Please, post the relevant code. If the code is large and complex, give us a link so we can see it in action, and just post snippets of it on the boards. - If the code is on an intranet or otherwise is not openly accessible, put it somewhere where we can access it. - Tell us any error messages from the JavaScript console in Firefox or Opera. (If you haven't tested it in those browsers, please do!) - If the code has both HTML/XML and JavaScript components, please show us both and not just part of it. - If the code has frames, iframes, objects, embeds, popups, XMLHttpRequest or similar components, tell us if you are trying it locally or from a server, and if the code is on the same or different servers. - We don't want to see the server side code in the form of PHP, PERL, ASP, JSP, ColdFusion or any other server side format. Show us the same code you send the browser. That is, show us the generated code, after the server has done it's thing. Generally, this is the code you see on a view-source in the browser, and specifically NOT the .php or .asp (or whatever) source code. I'm trying to get my Client Side Firefox DHTML app to display a list of eBooks. For this, i have the following files F:\Textbooks.html F:\eBooks.txt F:\FirstBook.txt F:\SecondBook.txt F:\ThirdBook.txt textbooks.html is my DHTML app eBooks.txt is the Library file with a listing of all of my eBooks. Inside of eBooks.txt is the following data: ----------------- FirstBook.txt, SecondBook.txt, ThirdBook.txt, ----------------- FirstBook.txt to ThirdBook.txt are my actual ebooks. The problem that i'm having is that When i try to click on any buttons other than the FirstBook button, i get the following error: ---------------------------------- Error: unterminated string literal Source File: file:///F:/Textbooks.html Line: 1, Column: 10 Source Code: LoadEbook(' ---------------------------------- So, unlike clicking on the FirstBook button, these other buttons do not load the eBook data into the DIV for displaying the eBook data. I use the DOM insepector to checkout the DOM of the button code, and it seems like whitespace maybe is the problem. However, i have removed whitespace from the HTMLdata string, and that's not fixing the problem. did i forget something silly? LOL i'm using FireFox 3.5 to develop this App. So obviously this will not work with anything other than Gecko Based browsers. here is my HTML code: <html> <head> <script language="JavaScript"> var eBookLibrary = "eBooks.txt"; var SystemPath = "f:" + String.fromCharCode(92) function Init() { // Initialize the eBook reader document.getElementById("EbookCanvas").style.visibility = "hidden"; document.getElementById("EbookToolbar").style.visibility = "visible"; document.getElementById("FileManager").style.visibility = "visible"; // Load the List of eBooks in the Library LoadBookList(); } function UpdateEbookList() { // Update the Library of Ebooks alert("Updating eBook Library"); // Go back to the File Manager, and Reload the List of Ebooks LoadBookList(); } function LoadBookList() { // This will load the list of books that are available var EbookList = LoadFromDisk(SystemPath + eBookLibrary); var EbookListArray = EbookList.split(","); for(var x = 0; x < EbookListArray.length -1; x++) { // Strip the Filename Extension off of the eBook File Name // The Name of the Book is always the first Index in the Array var BookName = EbookListArray[x].split("."); // Remove the weird whitespace - it screws things up...i think... BookName[0] = BookName[0].replace(/(^\s*|\s*$)/g, ""); var HTMLdata = HTMLdata + "<input type='button' value='" + "FirstBook" + "'" + " onClick=LoadEbook('" + EbookListArray[x] + "');><br>"; } // For some ****ed up reason the first string always generates an 'undefined' even though it's nonsense // So just delete that from the HTMLdata string, because it's just ugly - LOL HTMLdata = HTMLdata.replace("undefined", ""); HTMLdata = HTMLdata.replace("", " "); // Write the HTML data to the DIV document.getElementById("FileManager").innerHTML = HTMLdata; } function LoadEbook(EbookName) { // Hide the File Manager and Show the Ebook Canvas document.getElementById("FileManager").style.visibility = "hidden"; document.getElementById("EbookCanvas").style.visibility = "visible"; document.getElementById("EbookToolbar").style.visibility = "visible"; // Load the Ebook content into the Ebook Reader Pannel var EbookContent = LoadFromDisk(SystemPath + EbookName); document.getElementById("EbookCanvas").innerHTML = EbookContent; } function LoadFromDisk(filePath) { if(window.Components) try { netscape.security.PrivilegeManager.enablePrivilege("UniversalXPConnect"); var file = Components.classes["@mozilla.org/file/local;1"].createInstance(Components.interfaces.nsILocalFile); file.initWithPath(filePath); if (!file.exists()) return(null); var inputStream = Components.classes["@mozilla.org/network/file-input-stream;1"].createInstance(Components.interfaces.nsIFileInputStream); inputStream.init(file, 0x01, 00004, null); var sInputStream = Components.classes["@mozilla.org/scriptableinputstream;1"].createInstance(Components.interfaces.nsIScriptableInputStream); sInputStream.init(inputStream); return(sInputStream.read(sInputStream.available())); } catch(e) { //alert("Exception while attempting to load\n\n" + e); return(false); } return(null); } </script> </head> <body onLoad="Init();"> <div id="FileManager" style="position: absolute; top: 0px; left: 0px; visibility: visible;"> The eBook Library's List of Books will be listed here. Click on one to open it in the eBook Reader </div> <br> <div id="EbookCanvas" style="position: absolute; top: 0px; left: 0px; visibility: hidden;"> </div> <br> <div id="EbookToolbar" style="position: absolute; top: 100px; left: 0px;"> <input type="button" value="Open" OnClick="Init();"> <input type="button" value="Update" OnClick="UpdateEbookList();"> <input type="button" value="Exit" OnClick="MainMenu();"> </div> </body> </html> Hi all, I hope someone can advise whether such a script exists for what am wanting to do. From time to time, I need to send password information or login details and password information to some users. At the moment, am doing it via email with a subject named FYI and the body of the email basically just contain the login and the password or in some case, just the password. What am wanting to know is whether I can put these information into a HTML file which contains an obfuscated Javascript with a button that a user will click that will prompt for his login information and then will display the password. In its simplest form, I guess I am looking for a Javascript that will obfuscate a HTML file that contains the password. Anyway, hopefully someone understand what am looking for. I found some website that offers such service as obfuscating a HTML file but am hoping it can be done via a Javascript so it is at least "portable" and I do not have to be online. Any advice will be much appreciated. Thanks in advance. Hello all, I am currently looking to create a JavaScript menu for a website I am working on. It currently expands and collapses on click. The code in question is pasted below:- menu_status = new Array(); function showHide(theid){ if (document.getElementById) { var switch_id = document.getElementById(theid); if(menu_status[theid] != 'show') { switch_id.className = 'show'; menu_status[theid] = 'show'; }else{ switch_id.className = 'hide'; menu_status[theid] = 'hide'; } } } As you can see, it basically shows and hides the menu (when clicked). I want it to open the menu when clicked and close when another menu is opened. I have looked and have not been able to find a solution into it. Ideally I donot want it to be a long piece of code as I do have a working menu but with many more lines of JavaScript than the one I have posted. I need a solution to it urgently, your help is appreciated. Thanks Hi there, I am trying to create "sideways" sub menus off of my main vertical menu images. (Something like this example: http://netweblogic.com/demos/ddm/vddm-nomoo.htm but in the place of Menu Item 1, Menu Item 2, Menu Item 3 there would be roll over images.) The main vertical menu items I have are rollover images. I would like the sub menu to appear when you hover over the main menu item. When I attempt this using the above example, all of my other CSS and JS does not work. Any help on how to link my rollover menu images to the sub menu would be greatly appreciated! Thanks in advance! Here is the code for my menu (I have only included 2 menu items here, if you need more info please let me know): Code: <script type="text/javascript"> <!-- function MM_swapImgRestore() { //v3.0 var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc; } function MM_preloadImages() { //v3.0 var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array(); var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++) if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}} } function MM_findObj(n, d) { //v4.01 var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) { d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);} if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n]; for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document); if(!x && d.getElementById) x=d.getElementById(n); return x; } function MM_swapImage() { //v3.0 var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3) if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];} } //--> </script> </head> <body onload="MM_preloadImages('images/buttons/teamandcorpsports.jpg','images/buttons/performancesports.jpg','images/buttons/flagsandbanners.jpg','images/buttons/home.jpg','images/buttons/catalogues.jpg','images/buttons/galleries.jpg','images/buttons/designown.jpg','images/buttons/dealerlogin.jpg','images/buttons/contactus.jpg','images/buttons/dealersignup.jpg')"> <div id="wrapper"> <div id="header"> <h1> </h1> </div> <!-- Main content --> <div id="content"> <div style="text-align:center"> <img id="pic" src="images/slideshow/slideshow1.jpg" width="600" height="600" alt="slideshow" /> </div> <script type="text/javascript" src="slideshow.js"></script> </div> <!-- Site navigation menu --> <div id="navcontainer"> <ul> <li><a href="index.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('teamandcorpsports1','','images/buttons/teamandcorpsports.jpg',1)"><img src="images/buttons/teamandcorpsports1.jpg" alt="Team and Corporate Sports" name="teamandcorpsports1" width="224" height="37" border="0" id="teamandcorpsports1" /></a></li> <li><a href="index.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('performancesports1','','images/buttons/performancesports.jpg',1)"><img src="images/buttons/performancesports1.jpg" alt="Performance Sports" name="performancesports1" width="224" height="37" border="0" id="performancesports1" /></a></li> Here is my CSS code for the menu, not sure if this is where the issue is? Code: /* navigation menu */ #navcontainer ul { margin: 0; padding: 0; list-style-type: none; /* removes bullets */ background-image:url('background.jpg'); } #navcontainer li { margin: 0 0 0 0; /* separates list items */ } #navcontainer a { display: block; /* achieves rollover */ width: 250px; /* list width */ text-decoration: none; } |