JavaScript - Either Cookie Or Javascript Is Not Working In My Two Dropdown Menus Please Help!
Similar TutorialsHello, I REALLY like the dropdown menus that are on the Patagonia website. How difficult would this be to replicate? Is there a write-up or tutorial somewhere I can read and learn how to do this? Any help would be greatly appreciated, Thanks Here is the link: http://www.patagonia.com/web/us/home I am creating a cookie that increases a "value" or "integer" by 1 (ie Y+1) every time any page inside my webpage. Any webpage that i put the code into. right now I need it so that when you visit a page with the code it increases the variable or "cookie" (Y) by 1. when Y reaches a certain number, I.E 10, it resets Y to "0" and redirects you to a URL. Please explain where each value would go in any replies. Please make code as simple and as low in file size as possible. I don't need any sort of flexibility, just a simple redirect to a webpage which WILL NOT have the cookie code in it. EX: when opening the menu of an iPod game it asks you to rate the game, saying remind me later resets the value to "0" and saying rate now, resets to "0" but does not keep counting on the next page. Thanks to all in advance and i hope you completely understood my problem and question! [spoiler] Code: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> <title>Untitled Document</title> <script type="text/javascript"> function checkValue() String Y Y=Y+1 if(Y > 9){ alert(Y)} else{ alert(Y)} </script> </head> <body> <form action="Javascript:checkValue()" > <div align="center"> <input name="Logon" type="submit" value="Click Me"/> </div> <script type="text/javascript"> function checkValue() String Y; Y=Y+1; alert(Y); //if(Y > 9){ //alert(Y)} //else{ //alert(Y)} </script> </form> </body> </html> [/spoiler] I did not expect any of the above code to work, completely providing a new code will not surprise me or be a problem. Thanks again in advance! Hi, I have created a global navigation includes document. Unfortunately the drop down menus that are part of the navigation aren't working. They worked fine when they were part of the page, but now that they are separated from the page as includes the drop down menus don't appear in my test site (posted to a web server). All other content in the includes file appears and works. Any ideas? Thanks for your help. Hi there, im new to the forum and currently in the process of building a website. Unfortunetly it needs a little javascript putting in and I dont know any javascript atall. So heres my problem: -------------------- I want 3 drop down menus where you change the top option, the middle menu updates (from a sql database), you change the middle option then the bottom option updates (again from the database). you select the 3rd option. it searches a database for the item matching all 3 entrys it displays the price all without reloading the page then you add the item to cart. ------------ Heres my site with fake data in the dropdowns: http://xeon.donov.co.uk/~blinky/?a=cat_sub&cid=3&f=A3 hi, I am making a driving map which shows lines on the map based on point of departure and destination. It's working fine he http://www.xelawho.com/map/drive2.htm but what I would like to do is instead of having all the sidebar checkbox business, just to have two dropdown boxes - one for "from" and one for "to". I have seen plenty of these around but my problem is that my data comes from an xml file, so I guess the menus would have to be populated by loops. The other problem being that not every departure point goes to every destination, so the second menu would have to be populated dynamically depending on the option chosen in the first... does anybody have any ideas how I would do this? thanks in advance. i want to validate against the dropdown fields below name usrchoices which repeat depends upon the data records from database...so if there is 5 questions retrieved from the database then the 5 dropdowns appears with name usrchoices, i don't know how to validate all these fields...so please any one here fix the following code and send me....Thanks a Million <script language="JavaScript"><!-- function validating(validate) { **if (form.usrchoices.selectedIndex == 0) { ****alert('Please select all Questions'); ****document.getElementById("validate").reset(); * ****return false; **} **return true; } //--></script> <form action="submitsurvey.asp" method="post" name="validate" id="validate" onSubmit="return validating()"> <% Do while Recordset_questions.EOF %> ****<select name="usrchoices" id="usrchoices"> **********<option value="" selected>Select Choices</option> **********<option value="Y">Yes</option> **********<option value="N">No</option> **********<option value="IDK">I Dont know</option> ********</select> <%Loop%> </form> Is there such a thing as a dropdown menu that works in all browsers? (or at least all the commonly used ones)... Is JavaScript a good way to go? and if yes, are there any precoded templates available that are fairly straightforward to integrate and adapt for dropdowns?
Hi, i am building a website form which I would like the user to select a product of interest. Some products are three tiered and some are two tiered. 1. Example of three tier (3 dropdowns required only): Scooters (dropdown 1) Three Wheel Scooters (dropdown 2) Delux 503S Bird Scooter (dropdown 3) 2. Example of two tier (2 dropdowns required only): Standing Bikes (dropdown 1) Children 300 Series (dropdown 2) If the user wants to submit their interest for one of the products, I need to have at most 3 dropdown menus. So in Example 1, I would have 3 dropdowns in my form. Dropdown 1: Scooters Dropdown 2: Three Wheel Scooters Dropdown 3: Delux 503S Bird Scooter In Example 2, I would only need to use the first 2 dropdown menus. (Obviously the first dropdown would contain 'Scooters' and 'Standing Bikes' in the menu list) The below code is perfect except, I would like to alter the code so that the second and third dropdowns are hidden until a selection from the first drop down is made. Once for example, 'Standing Bikes' is selected from the first dropdown menu, the second dropdown menu appears and the third remains hidden due to the fact that it is not required. If I selected Scooters from the first dropdown menu, the second dropdown would appear listing all items associated with this and at this point the third dropdown menu is hidden. If i select 'Three Wheel Scooter' from the second dropdown the third dropdown menu now appears listing all Three wheel Scooters such as 'Delux 503S Bird Scooter'. I hope this makes sense. Let me know if you require clarrification. Here is the code: Code: <script language="JavaScript" type="text/javascript"> <!-- /* *** Multiple dynamic combo boxes *** by Mirko Elviro, 9 Mar 2005 *** Script featured and available on JavaScript Kit (http://www.javascriptkit.com) *** ***Please do not remove this comment */ // This script supports an unlimited number of linked combo boxed // Their id must be "combo_0", "combo_1", "combo_2" etc. // Here you have to put the data that will fill the combo boxes // ie. data_2_1 will be the first option in the second combo box // when the first combo box has the second option selected // first combo box data_1 = new Option("1", "$"); data_2 = new Option("2", "$$"); // second combo box data_1_1 = new Option("11", "-"); data_1_2 = new Option("12", "-"); data_2_1 = new Option("21", "--"); data_2_2 = new Option("22", "--"); data_2_3 = new Option("23", "--"); data_2_4 = new Option("24", "--"); data_2_5 = new Option("25", "--"); // third combo box data_1_1_1 = new Option("111", "*"); data_1_1_2 = new Option("112", "*"); data_1_1_3 = new Option("113", "*"); data_1_2_1 = new Option("121", "*"); data_1_2_2 = new Option("122", "*"); data_1_2_3 = new Option("123", "*"); data_1_2_4 = new Option("124", "*"); data_2_1_1 = new Option("211", "**"); data_2_1_2 = new Option("212", "**"); data_2_2_1 = new Option("221", "**"); data_2_2_2 = new Option("222", "**"); data_2_3_1 = new Option("231", "***"); data_2_3_2 = new Option("232", "***"); // fourth combo box data_2_2_1_1 = new Option("2211","%") data_2_2_1_2 = new Option("2212","%%") // other parameters displaywhenempty="" valuewhenempty=-1 displaywhennotempty="-select-" valuewhennotempty=0 function change(currentbox) { numb = currentbox.id.split("_"); currentbox = numb[1]; i=parseInt(currentbox)+1 // I empty all combo boxes following the current one while ((eval("typeof(document.getElementById(\"combo_"+i+"\"))!='undefined'")) && (document.getElementById("combo_"+i)!=null)) { son = document.getElementById("combo_"+i); // I empty all options except the first one (it isn't allowed) for (m=son.options.length-1;m>0;m--) son.options[m]=null; // I reset the first option son.options[0]=new Option(displaywhenempty,valuewhenempty) i=i+1 } // now I create the string with the "base" name ("stringa"), ie. "data_1_0" // to which I'll add _0,_1,_2,_3 etc to obtain the name of the combo box to fill stringa='data' i=0 while ((eval("typeof(document.getElementById(\"combo_"+i+"\"))!='undefined'")) && (document.getElementById("combo_"+i)!=null)) { eval("stringa=stringa+'_'+document.getElementById(\"combo_"+i+"\").selectedIndex") if (i==currentbox) break; i=i+1 } // filling the "son" combo (if exists) following=parseInt(currentbox)+1 if ((eval("typeof(document.getElementById(\"combo_"+following+"\"))!='undefined'")) && (document.getElementById("combo_"+following)!=null)) { son = document.getElementById("combo_"+following); stringa=stringa+"_" i=0 while ((eval("typeof("+stringa+i+")!='undefined'")) || (i==0)) { // if there are no options, I empty the first option of the "son" combo // otherwise I put "-select-" in it if ((i==0) && eval("typeof("+stringa+"0)=='undefined'")) if (eval("typeof("+stringa+"1)=='undefined'")) eval("son.options[0]=new Option(displaywhenempty,valuewhenempty)") else eval("son.options[0]=new Option(displaywhennotempty,valuewhennotempty)") else eval("son.options["+i+"]=new Option("+stringa+i+".text,"+stringa+i+".value)") i=i+1 } //son.focus() i=1 combostatus='' cstatus=stringa.split("_") while (cstatus[i]!=null) { combostatus=combostatus+cstatus[i] i=i+1 } return combostatus; } } //--> </script> <form> <select name="combo0" id="combo_0" onChange="change(this);" style="width:200px;"> <option value="value1">-select-</option> <option value="value2">1</option> <option value="value3">2</option> </select> <BR><BR> <select name="combo1" id="combo_1" onChange="change(this)" style="width:200px;"> <option value="value1"> </option> </select> <BR><BR> <select name="combo2" id="combo_2" onChange="change(this);" style="width:200px;"> <option value="value1"> </option> </select> <BR><BR> <select name="combo3" id="combo_3" onChange="change(this);" style="width:200px;"> <option value="value1"> </option> </select> </form> <p align="center">This free script provided by<br /> <a href="http://javascriptkit.com">JavaScript Kit</a></p> The menus are supposed to come out from the side, as an animation. I thought I had the correct code but for some reason it isn't working. Could anyone take a look at my Javascript at let me know what I'm doing wrong? Thanks... Here are my files: HTML: Code: <?xml version="1.0" encoding="UTF-8" ?> <!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"> <head> <!-- New Perspectives on JavaScript, 2nd Edition Tutorial 4 Review Assignment The 221B Blog Author: Date: March 6, 2011 Filename: sherlock.htm Supporting files: logo.jpg, mblog.css, sh.jpg, slides.js --> <title>The Works of Sherlock Holmes</title> <link href="mblog.css" rel="stylesheet" type="text/css" /> <script type="text/javascript" src="slides.js"></script> <!--[if IE]> <style type="text/css"> /* IE-specific styles to ensure list of links is rendered properly */ #linkList ul li {float: left; width: 100%} #linkList ul li a {height: 1%} </style> <![endif]--> </head> <body> <div id="page"> <form id="searchForm" action=""> <div id="head"> <img src="logo.jpg" alt="The 221B Blog" /> <input id="searchTxt" type="text" size="20" /> <label for="searchTxt">Search</label> </div> <div id="linkList"> <ul> <li><a href="#">Home</a></li> <li><ul class="newGroup"> <li class="slideMenu"> <a href="#" class="pTitle">The Adventures of Sherlock Holmes <img class="arrow" src="arrow.gif" alt="" /></a> <ul id="list1"> <li><a href="#">A Scandal in Bohemia</a></li> <li><a href="#">The Red-headed League</a></li> <li><a href="#">A Case of Identity</a></li> <li><a href="#">The Boscombe Valley Mystery</a></li> <li><a href="#">The Five Orange Pips</a></li> <li><a href="#">The Man with the Twisted Lip</a></li> <li><a href="#">The Blue Carbuncle</a></li> <li><a href="#">The Speckled Band</a></li> <li><a href="#">The Engineer's Thumb</a></li> <li><a href="#">The Noble Bachelor</a></li> <li><a href="#">The Beryl Coronet</a></li> <li><a href="#">The Copper Beeches</a></li> </ul> </li> </ul></li> <li><ul> <li class="slideMenu"> <a href="#">The Memoirs of Sherlock Holmes <img class="arrow" src="arrow.gif" alt="" /></a> <ul id="list2"> <li><a href="#">Silver Blaze</a></li> <li><a href="#">The Yellow Face</a></li> <li><a href="#">The Stock-broker's Clerk</a></li> <li><a href="#">The "Gloria Scott"</a></li> <li><a href="#">The Musgrave Ritual</a></li> <li><a href="#">The Reigate Puzzle</a></li> <li><a href="#">The Crooked Man</a></li> <li><a href="#">The Resident Patient</a></li> <li><a href="#">The Greek Interpreter</a></li> <li><a href="#">The Naval Treaty</a></li> <li><a href="#">The Final Problem</a></li> </ul> </li> </ul></li> <li><ul> <li class="slideMenu"> <a href="#">The Return of Sherlock Holmes <img class="arrow" src="arrow.gif" alt="" /></a> <ul id="list3"> <li><a href="#">The Empty House</a></li> <li><a href="#">The Norwood Builder</a></li> <li><a href="#">The Dancing Men</a></li> <li><a href="#">The Solitary Cyclist</a></li> <li><a href="#">The Priory School</a></li> <li><a href="#">Black Peter</a></li> <li><a href="#">Charles Augustus Milverton</a></li> <li><a href="#">The Six Napoleons</a></li> <li><a href="#">The Three Students</a></li> <li><a href="#">The Golden Pince-Nez</a></li> <li><a href="#">The Missing Three-Quarter</a></li> <li><a href="#">The Abbey Grange</a></li> <li><a href="#">The Second Stain</a></li> </ul> </li> </ul></li> <li><ul> <li class="slideMenu"> <a href="#">The Case Book of Sherlock Holmes <img class="arrow" src="arrow.gif" alt="" /></a> <ul id="list4"> <li><a href="#">The Illustrious Client</a></li> <li><a href="#">The Blanched Soldier</a></li> <li><a href="#">The Mazarin Stone</a></li> <li><a href="#">The Three Gables</a></li> <li><a href="#">The Sussex Vampire</a></li> <li><a href="#">The Three Garridebs</a></li> <li><a href="#">Thor Bridge</a></li> <li><a href="#">The Creeping Man</a></li> <li><a href="#">The Lion's Mane</a></li> <li><a href="#">The Veiled Lodger</a></li> <li><a href="#">Shoscombe Old Place</a></li> <li><a href="#">The Retired Colourman</a></li> </ul> </li> </ul></li> <li><ul> <li class="slideMenu"> <a href="#">His Last Bow <img class="arrow" src="arrow.gif" alt="" /></a> <ul id="list5"> <li><a href="#">Wisteria Lodge</a></li> <li><a href="#">The Cardboard Box</a></li> <li><a href="#">The Red Circle</a></li> <li><a href="#">The Bruce-Partington Plans</a></li> <li><a href="#">The Dying Detective</a></li> <li><a href="#">The Disappearance of Lady Frances Carfax</a></li> <li><a href="#">The Devil's Foot</a></li> <li><a href="#">His Last Bow</a></li> </ul> </li> </ul></li> <li><ul> <li class="slideMenu"> <a href="#">The Novels <img class="arrow" src="arrow.gif" alt="" /></a> <ul id="list6"> <li><a href="#">A Study in Scarlet</a></li> <li><a href="#">The Sign of the Four</a></li> <li><a href="#">The Hound of the Baskervilles</a></li> <li><a href="#">The Valley of Fear</a></li> </ul> </li> </ul></li> <li><ul class="newGroup"> <li class="slideMenu"> <a href="#">The 221B Community <img class="arrow" src="arrow.gif" alt="" /></a> <ul id="list7"> <li><a href="#">Essays</a></li> <li><a href="#">Fan Fiction</a></li> <li><a href="#">Art</a></li> <li><a href="#">Discussion Forum</a></li> <li><a href="#">Issues Archive</a></li> </ul> </li> </ul></li> <li><ul> <li class="slideMenu"> <a href="#">Holmes on the Web <img class="arrow" src="arrow.gif" alt="" /></a> <ul id="list8"> <li><a href="#">The 221B Museum</a></li> <li><a href="#">Jeremy Brett Page</a></li> <li><a href="#">Basil Rathbone Page</a></li> <li><a href="#">The Baker Street Irregulars</a></li> </ul> </li> </ul></li> <li><ul> <li class="slideMenu"> <a href="#">Multimedia <img class="arrow" src="arrow.gif" alt="" /></a> <ul id="list9"> <li><a href="#">Radio Podcasts</a></li> <li><a href="#">Audiobooks</a></li> <li><a href="#">Video Clips</a></li> </ul> </li> </ul></li> <li><ul> <li class="slideMenu"> <a href="#">Doyle's Life & Times <img class="arrow" src="arrow.gif" alt="" /></a> <ul id="list10"> <li><a href="#">About Arthur Conan Doyle</a></li> <li><a href="#">Victorian England</a></li> <li><a href="#">Strand Magazine</a></li> <li><a href="#">The Holmes Atlas</a></li> </ul> </li> </ul></li> <li><ul> <li class="slideMenu"> <a href="#">Other Fictional Detectives <img class="arrow" src="arrow.gif" alt="" /></a> <ul id="list11"> <li><a href="#">Miss Marple</a></li> <li><a href="#">Hercule Poirot</a></li> <li><a href="#">Ellery Queen</a></li> </ul> </li> </ul></li> <li class="newGroup"><a href="#">About Me</a></li> </ul> </div> <div id="main"> <img src="sh.jpg" alt="" style="float: right; margin: 0px 0px 5px 5px" /> <p id="firstp"> The most famous of fictional detectives, Sherlock Holmes first appeared in print in 1887, in stories written by the Scottish author and physician, Sir Arthur Conan Doyle. Holmes is famous for his use of deductive reasoning to solve difficult and complex cases. Almost all Holmes stories are told in the first-person narration of Dr. John Watson, Holmes' closest friend and confidant.</p> <p>Doyle wrote four novels and 56 short stories in the Sherlock Holmes canon. The first Holmes tale was the novel, <i>A Study in Scarlet</i> which chronicled the meeting of Holmes and Watson and covered their first case together. As Doyle wrote additional tales, the Sherlock Holmes stories grew in popularity, becoming a regular feature of The Strand magazine. Desiring to explore other literary pursuits, Doyle grew tired of the detective and killed off Holmes in the short story <i>The Final Problem</i>. However public acclaim and a desire for more Holmes stories eventually persuaded Doyle to resurrect the popular detective, bringing him back in <i>The Adventure of the Empty House</i>.</p> <p>Doyle's final Holmes story, <i>His Last Bow</i> appeared in 1914, but that did not end the public's fascination with Holmes and Watson. Basil Rathbone brought the character to the silver screen in 14 movies loosely based on Doyle's original stories. In more recent years, Jeremy Brett played Holmes to great critical acclaim over four seasons of the BBC series, <i>The Adventures of Sherlock Holmes</i>. In all, Holmes has been played by over 70 actors appearing in over 200 films.</p> <p>To enjoy online versions of the Sherlock Holmes short stories and novels, select entries from the menu on the left.</p> </div> </form> </div> </body> </html> Javascript: Code: /* New Perspectives on JavaScript, 2nd Edition Tutorial 4 Review Assignment Author: Date: Filename: slides.js ------------------------------------------------------------- Function List: makeMenus() Initializes the contents of the mystery.htm Web page, locating the sliding menus, setting their initial positions and display styles and defining the onevent handlers. showSlide() Shows a sliding menu while hiding any inactive menus closeSlide() Closes an inactive sliding menu moveSlide() Moves a sliding menu horizontally across the page ------------------------------------------------------------- Global Variable List: currentSlide An object variable pointing to the currently active sliding menu timeID A variable containing the id of a timed command using the setInterval method leftPos The current left position of the sliding menu as it is moved across the page ------------------------------------------------------------- */ window.onload = makeMenus; var currentSlide = null; var timeID = null; var leftPos = 0; function makeMenus() { var slideMenus = new Array(); var allElems = document.getElementsByTagName("*"); for (var i = 0; i < allElems.length; i++) { if (allElems[i].className == "slideMenu") slideMenus.push(allElems[i]); } for (var i = 0; i < slideMenus.length; i++) { slideMenus[i].onclick = showSlide; slideMenus[i].getElementsByTagName("ul")[0].style.left = "0px"; } document.getElementsById("head").onclick = closeSlide; document.getElementsById("main").onclick = closeSlide; } function showSlide() { slideList = this.getElementsByTagName("ul")[0]; if (currentSlide && currentSlide.id == slideList.id) { closeSlide(); } else { closeSlide(); currentSlide = slideList; currentSlide.style.display = "block"; timeID = setInterval("moveSlide()", 1); } } function closeSlide() { if (currentSlide) { clearInterval(timeID); currentSlide.style.left = "0px"; currentSlide.style.display = "none"; currentSlide = null; } } function moveSlide() { leftPos += 5; if (parseInt(currentSlide.style.left) <=220) { currentSlide.style.left = leftPos + "px"; } else { clearInterval(timeID); leftPos = 0; } } CSS Code: /* New Perspectives on JavaScript, 2nd Edition Tutorial 4 Review Assignment Author: Date: Filename: mblog.css This file contains styles used in the sherlock.htm file. */ * {padding: 0px; margin: 0px; line-height: 1.2} body {background-color: white; font-family: 'Trebuchet MS', Arial, Verdana, sans-serif; font-size: 12px} #page {position: absolute; top: 0px; left: 10px; width: 1000px} a {text-decoration: none; color: black} p {margin: 15px 0px} #head {width: 800px; height: 108px; background-color: white; border-bottom: 1px solid black; margin-bottom: 10px} #head img {float: left} #head label {float: right; margin-top: 15px; margin-right: 10px} #head input {float: right; margin-top: 15px; background-color: ivory} #main {float: left; margin-left: 20px; z-index: 1; width: 600px; background-color: white} #firstp {margin-top: 0px} #firstp:first-line {font-variant: small-caps; font-weight: bold} #firstp:first-letter {float: left; font-size: 400%; font-family: 'Times New Roman', serif; line-height: 0.8; margin: 0px 5px 0px 0px} #linkList {width: 225px; background: rgb(0, 14, 238); float: left} #linkList ul {list-style: none; margin: 0px; padding: 0px} #linkList a {font: bold 11px/16px arial, helvetica, sans-serif; display: block; border-width: 1px; border-style: solid; border-color: #ccc #888 #555 #bbb; margin: 0px; padding: 2px 3px} #linkList a {color: black; background-color: rgb(172, 172, 172); text-decoration: none} #linkList a:hover {color: white; background: rgb(0, 0, 255)} #linkList li {position: relative} #linkList ul ul ul {position: absolute; display: none; top: 0px; left: 100%; width: 100%} #linkList .arrow {position: absolute; left: 210px; border-width: 0px} #linkList .newGroup {border-top: 1px solid red; z-index: 2} #linkList .slideMenu > a {z-index: 2; position: relative} I've built a site with DW4 and the spry menus are not working. they worked for a little while and then I changed something in the JS menu on the template and now none of the spry works on my site. also, I imbedded a google gadget and that didn't show up either! any help would be appreciated. thx: The guy who originally coded this is no longer with us and we can't seem to figure out why this code isn't working. Neither of us really know JS. I've messed with jQuery more than I've messed with straight up JS but even that is limited knowledge. Basically this code is supposed to keep track of the left navigation so when it goes to a new page it holds the opened menus open. Here's a snippet of HTML: Code: <ul id="leftnav"> <li class="widthT1"> <div id="2042-open" style="display: none;"><a href="javascript:treeToggle('2042', 'open', '/JobSeekers/Recently_Unemployed/index.aspx');" class="orangePlus">Recently Unemployed</a></div> <div id="2042-close" style="margin-bottom:10px;"><a href="javascript:treeToggle('2042', 'close');" class="orangeMinus">Recently Unemployed</a> <!--<div class="fix1"><hr class="grey1HR"/></div>--> <ul class="fix4"> <li> <div id="2063-open" style="display: none;"><a href="javascript:treeToggle('2063', 'open', '/JobSeekers/Recently_Unemployed/Apply_for_Unemployment_Insurance_Benefits/index.aspx');" class="orangePlusGT2">Apply for Unemployment Insurance Benefits</a></div> <div id="2063-close"><a href="javascript:treeToggle('2063', 'close');" class="orangeMinusGT2">Apply for Unemployment Insurance Benefits</a> <!--<div class="fix2"><hr class="grey2HR"/></div>--> <ul> The above is repeated but that should be enough to show you what it's doing? Here's the JS: Code: function getTreeStateArray() { var empty = new Array(); var soc = document.cookie.indexOf("treestate="); if(soc != -1) { var eoc = document.cookie.indexOf("-", soc); if(eoc == -1) eoc = document.cookie.length; return(unescape(document.cookie.substring(soc+10, eoc)).split("-")); } return(empty); } function setTreeStateArray(treeState) { document.cookie = "treestate=" + escape(treeState.join("-")); } function restoreTreeState(treeID) { var treestate = getTreeStateArray(); var i, j, treeNodeName, treeElements; treeElements = document.getElementById(treeID).getElementsByTagName("div"); for(i = 0; i < treeElements.length; i++) { var sosuffix = treeElements[i].id.indexOf('-close'); if(sosuffix == -1) sosoffix = treeElements[i].id.indexOf('-open'); if(sosuffix != -1) { var nodeName = treeElements[i].id.substring(0, sosuffix); var found = false; for(j = 0; j < treestate.length; j++) { if(treestate[j] == nodeName) found = true; } if(found == true) { document.getElementById(nodeName + '-open').style.display = 'none'; document.getElementById(nodeName + '-close').style.display = 'block'; } else { document.getElementById(nodeName + '-open').style.display = 'block'; document.getElementById(nodeName + '-close').style.display = 'none'; } } } } function removeNodeFromTreeState(nodeName) { var treestate = getTreeStateArray(); var newTreeState = new Array(); var i, treeNodeName; for(i = 0; i < treestate.length; i++) { treeNodeName = treestate[i]; if(treeNodeName != nodeName) newTreeState.push(treeNodeName); } setTreeStateArray(newTreeState); } function addNodeToTreeState(nodeName) { var treestate = getTreeStateArray(); var newTreeState = new Array(); var i, treeNodeName; for(i = 0; i < treestate.length; i++) { treeNodeName = treestate[i]; if(treeNodeName == nodeName) return; newTreeState.push(treeNodeName); } newTreeState.push(nodeName); setTreeStateArray(newTreeState); } function treeToggle(treeNodeName, treeNodeState, followLink) { if(treeNodeState == 'open') { addNodeToTreeState(treeNodeName); document.getElementById(treeNodeName + '-open').style.display = 'none'; document.getElementById(treeNodeName + '-close').style.display = 'block'; if(typeof(followLink) != 'undefined') window.location.href = followLink; } else { removeNodeFromTreeState(treeNodeName); document.getElementById(treeNodeName + '-open').style.display = 'block'; document.getElementById(treeNodeName + '-close').style.display = 'none'; } } What happens is it remembers the first thing you click on, but nothing more. We looked at the cookie value and it seems to be right. 4digit number followed by - followed by 4 more digits etc etc (0000-0001-0002 etc) If anyone could help that would be wonderful. Thanks for any and all help, Justin Hello, i am trying to implement JavaScript menus for my website. I've used a ready-made one from apycom. The menu works fine, however the problem is that whenever i try to have more than one of the same menu, the second menu does not work. I'm generally a PHP coder, and i'm not very useful when it comes to JavaScript, so please excuse me. I'll bring some code into this: Quote: <div id="menu"> <ul class="menu" id="menu"> <li><a href="browse.php?id=44&<?php echo "sort=".$sort; ?>" class="parent"><span>My Account</span></a> <div><ul> <!-- <li><a href="browse.php?id=84&<?php echo "sort=".$sort; ?>"><span>Sign-In</span></a></li> --> <li><span><input type="text" name="title"></span></li> <li><a href="browse.php?id=85&<?php echo "sort=".$sort; ?>"><span>Register</span></a></li> <li><a href="browse.php?id=86&<?php echo "sort=".$sort; ?>"><span>Upload</span></a></li> </ul></div> </li> </ul> </div> <br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br> <div id="menu"> <ul class="menu" id="menu2"> <li><a href="browse.php?id=44&<?php echo "sort=".$sort; ?>" class="parent"><span>My Account</span></a> <div><ul> <!-- <li><a href="browse.php?id=84&<?php echo "sort=".$sort; ?>"><span>Sign-In</span></a></li> --> <li><span><input type="text" name="title"></span></li> <li><a href="browse.php?id=85&<?php echo "sort=".$sort; ?>"><span>Register</span></a></li> <li><a href="browse.php?id=86&<?php echo "sort=".$sort; ?>"><span>Upload</span></a></li> </ul></div> </li> </ul> </div> You can ignore the hrefs, there for local use. I'm under the impression the identities of each menu is duplicated, but i'm not sure how to allow separation of identities. The second menu works, mouseover the menu comes up but the fade effect does not work. Can someone please help? Thank you. Hi everyone, I am very new to javascript & web editing in general, so I apologize if this is a silly question. I am designing a site using this menu: http://dynamicdrive.com/dynamicindex1/slideinmenu.htm I would like to have two of these menus on the page. Ideally, each will pop out on a rollover. Currently, when I copy and paste the code, only one works (and pops out no matter which menu is rolled over). How do I need to change the code so that both will work independently of each other on the same page? The CSS styling will be the same for both, however they will have different menu items. Thank you in advance!!! Hi, I am wanting to do menus and image slideshows using javascript because my existing flash menus and slide shows no longer work on many newer devices. To save time learning all about Javascript, I purchased WoW Slider and Apycom Menus, two programs that do it all for you. Independantly both programs work perfectly, however if I use both programs together on the same website, as soon as I add my image slider it messes up my menu for that page. the menu item colours and bouncy effects when I do a mouseover on menu items no longer work correctly. Example http://www.dorset-self-catering.com note the menu working correctly on mouseover, then go to second page called "Information", this page also has a slideshow and if you now do a mouseover on the menu, you will see that all the nice properties no longer work. Is anyone able to offer some advice please. David Priest Hi i used cookies to store data using java script with 2 calculators, but there is a 3rd calculator that the cookies arent storing, can someone help me figure out where to implement the script?
anyone can help me in cookie ? i couldn't get it to work. My objective is when i click the submit button in the guestbook page, the cookie will then capture just the 'name' and display it out in thankyou page. guestbook page var seconds = 0; function startTimer() { window.setInterval("updateTime()", 1000); } function updateTime() { seconds++; soFar.innerText = seconds; } function validate_email(field) { with (field) { apos=value.indexOf("@"); //find the position of the @ character dotpos=value.lastIndexOf(".");// find the last position of the . character if (apos<1||dotpos-apos<2) { alert("Not a valid e-mail address!"); return false; } } } function validate_length(field) { with(field) { if (value.length == 0) { alert("Please fill up the column!"); return false; } } } function getCookie(NameOfCookie){ if (document.cookie.length > 0) { begin = document.cookie.indexOf(NameOfCookie+"="); if (begin != -1){ begin += NameOfCookie.length+1; end = document.cookie.indexOf(";",begin); if (end == -1) end = document.cookie.length; return unescape(document.cookie.substring(begin, end)); } } return null; } function setCookie(NameOfCookie, value, expiredays) { var ExpireDate = new Date (); ExpireDate.setTime(ExpireDate.getTime() + (expiredays * 24 *3600 * 1000)); document.cookie = NameOfCookie + "=" + escape(value) + ((expiredays == null)?"" : ";expires=" + ExpireDate.toGMTString()); } function delCookie (NameOfCookie){ if (getCookie(NameOfCookie)){ document.cookie = NameOfCookie + "=" + "; expires=Thu,01-JAN-70 00:00:01 GMT"; } } function validate_form(thisform) { with (thisform) { if (validate_length(yourname) == false) { yourname.focus(); return false; } if (validate_length(email)==false || validate_email(email)==false) { email.focus(); return false; } if ( ( document.contact_my.gender[0].checked == false ) && ( document.contact_my.gender[1].checked == false ) ) { alert ( "Please choose your Gender: Male or Female" ); valid = false; contact_my.focus(); return false; } } } </script> <form name="contact_my" action="thankyou.html" onSubmit="return validate_form(this)" && onClick="setCookie" method="post" > <input type="submit" value="Submit"> <input type="reset" value="Reset form" onClick="delCookie( 'username' )"> thankyou page function getCookie(NameOfCookie){ if (document.cookie.length > 0) { begin = document.cookie.indexOf(NameOfCookie+"="); if (begin != -1){ begin += NameOfCookie.length+1; end = document.cookie.indexOf(";",begin); if (end == -1) end = document.cookie.length; return unescape(document.cookie.substring(begin, end)); } } return null; } function setCookie(NameOfCookie, value, expiredays) { var ExpireDate = new Date (); ExpireDate.setTime(ExpireDate.getTime() + (expiredays * 24 *3600 * 1000)); document.cookie = NameOfCookie + "=" + escape(value) + ((expiredays == null)?"" : ";expires=" + ExpireDate.toGMTString()); } function DoTheCookieStuff() { username=getCookie ('username'); if ( username!=null ) {document.writeln ('Hi there '+username+' - Good to see you again!')} } Hey guys, Here is my question: Is it possible to extract a cookie inside a textarea? For example, I am building a very basic shopping cart in Javascript, with "Add to Cart" buttons listed for each item. As the "Add to Cart" button is pressed, a cookie is created. There is a link in which you can click with "Review Order", which consists of a textarea that displays the items that you have 'purchased'. I am trying to get the value of the cookie to be extracted into this textarea, however I am not sure if this is possible. Thanks Hey guys, i'm trying to incorporate cookies with the website i'm working on. I've looked at tutorials where they just hand you the code and say "get on with it", this leaves me in the lurch while trying to debug it... so the question is are there any good javascript cookie tutorials that will "explain what the heck this does?" Thanks Al. I have been looking all over the web for a solution, because my website displays funky in safari. To fix this i figured i'd tell users that if they are using safari, then using javascript, i could tell them a message. Originally i tried detecting safari then displaying a message. But i couldn't ever find a browser detection for safari. So i thought wait.... If i could: 1. get a javascript alert saying my message. 2. time that message alert frequency by a session, say 10 days? or even every browser session... Then i could solve my problem. However i can't figure out any of this. So if anybody would be willing to help, i'd be very grateful. hello everybody, here I'm asking for help again. sorry for that in advance. anyhow, I have the following code: 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"> <head> <link type="text/css" media="screen" rel="stylesheet" href="colorbox.css" /> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script> <script type="text/javascript" src="../colorbox/jquery.colorbox.js"></script> <script type="text/javascript"> $(document).ready(function(){ $(".example7").colorbox({width:"300px", height:"500px", iframe:true, open: true}); }); </script> </head> <body onload="example7();"> <a class='example7' href="tofes.html"></a> teststestestest </body> </html> I want the lightbox window open only once a day for every unique visitor on my website. I understand I should use some sort of cookie implented, but I dont really understand how to. Thanks in advance, daniel. |