JavaScript - Complete Noooob
http://yfrog.com/ed20392020p need 2 make those 2 pics in java n i dont even know where to start T-T, the one on the right is supoose to be like lil boat lookin things can anyone give me a place where i can learn to make a line then array it from the center? Similar TutorialsHello, I am trying to complete a test site but adding some javascript. In short I am trying to make the main content div slide from behind the nav via some JS. http://www.squareflash.com/test/index.html First I am just trying to get the animate onClick to work. I found this practice site -- Using this I am trying to get some guidance on how to add a automatic stop function to the moveRight variable. http://www.tutorialspoint.com/cgi-bi...=javascript_45 The site is in html5, is there anything special I need to know for that? ty I have been searching for years to get ahold of a complete reference to the ECMAscript languages. I was recently watching some old videos by Douglas Crockford. He talked about the 'set' and 'get' statements. I had never heard of them before... and infact was one of the things I really missed from Delphi and have been wishing for in javascript. Even now I can't find any references that contain them. I keep having this feeling that there is so much more in the language than I know about and there is no easy way to learn it. Where is the most complete reference of the language? David I have used the following script to make provide matching value suggestions for any text typed in the text box and user can select any value by clicking it this works fine in firefox, crome but not in IE. <!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=utf-8" /> <title>Ajax Auto Suggest</title> <!--http://www.nodstrum.com/2007/09/19/autocompleter/ --> <script type="text/javascript" src="jquery-1.2.1.pack.js"></script> <script type="text/javascript"> function lookup(inputString) { if(inputString.length == 0) { // Hide the suggestion box. $('#suggestions').hide(); } else { $.post("rpc.asp?inputString="+inputString+"", {}, function(data){ if(data.length >0) { $('#suggestions').show(); $('#autoSuggestionsList').html(data); } }); } } // lookup function fill(thisValue) { $('#inputString').val(thisValue); boxhide(); } function boxhide() { setTimeout("$('#suggestions').hide();", 200); } </script> <style type="text/css"> body { font-family: Helvetica; font-size: 11px; color: #000; } h3 { margin: 0px; padding: 0px; } .suggestionsBox { position: relative; left: 30px; margin: 10px 0px 0px 0px; width: 200px; background-color: #212427; -moz-border-radius: 7px; -webkit-border-radius: 7px; border: 2px solid #000; color: #fff; } .suggestionList { margin: 0px; padding: 0px; } .suggestionList li { margin: 0px 0px 3px 0px; padding: 3px; cursor: pointer; } .suggestionList li:hover { background-color: #659CD8; } </style> </head> <body> <div> <form> <div> Type your county: <br /> <input type="text" size="30" value="" id="inputString" onkeyup="lookup(this.value);" onblur="boxhide();" /> </div> <div class="suggestionsBox" id="suggestions" style="display: none;"> <img src="upArrow.png" style="position: relative; top: -12px; left: 30px;" alt="upArrow" /> <div class="suggestionList" id="autoSuggestionsList"> </div> </div> </form> </div> </body> </html> rpc.asp returns values matching the inputstring passed <li id='suggestedValue' onclick=""fill('Matchvalue');"">Matchvalue</li> Any help? Hi, I'm trying to work through a head first book on ajax and javascript. I am also trying to emplement some of the codes in a small application I had built strictly with server side code. What it does is: two input fields for user defined values. Once the user inputs the two values, they are passed to the action page, some simple math is performed on these 2 values, and then 4 different resluts are displayed back on the action page. What I wanted was of course to make this asynchronous and display the results without a page reload. So, when I reworked the book code for my own use, and try to run the application, I get an error saying my url variable is undefined. The value of the first input seems to be passed though. One thing of note to mention is the application was written in coldfusion. The form values are passed using cf. Not sure if that matters. I mean cf works well with js and ajax, but maybe my original procedure doesnt work with my js code as it is now. Here is the javascript/ajax code: PHP Code: <script type="text/javascript" language="javascript"> var request = null; try { request = new XMLHttpRequest(); } catch (trymicrosoft) { try { request = new ActiveXObject("Msxm12.XMLHTTP"); } catch (othermicrosoft) { try { request = new ActiveXObject("Microsoft.XMLHTTP"); } catch (failed) { request = null; } } if(request == null) alert("Error creating request object!"); } function getLampVolts() { var lamp = document.getElementById("lampVoltage").value; var url = "calculatorAction.cfm?lamp = " + escape(lampVolts); request.open("GET", url, true); request.onreadystatechange = updatePage; request.send(null); } function updatePage() { if(request.readyState == 4) { if(request.status == 200) { var lumens = request.responseText; document.getElementById("lumens").value = lumens; } else alert("Error! Request Status is " + request.status); } } </script> Here is the form: Code: <form action="calculatorAction.cfm"> <table> <tr> <th>Lamp Voltage</th> <td><input name="lampVoltage" id="lampVoltage" type="text" /></td> </tr> <tr> <th>Socket Voltage</th> <td><input name="socketVoltage" id="socketVoltage" type="text" /></td> </tr> <tr> <td><input type="button" value="Submit" onClick="getLampVolts();" /></td> <td><input type="reset" value="Reset" /></td> </tr> </table> and here is my action page calculatorAction.cfm: Code: <cfparam name="bulbCalculator.cfm" type="any" default="0"> <!--- Set User Defined Values of Form ---> <cfset lampVolts = FORM.lampVoltage> <cfset actualVolts = FORM.socketVoltage> <!--- Set Constants For Calculations ---> <cfset lumens = 27500> <cfset life = 500> <cfset watts = 65> <cfset colorTemp = 3500> <!--- Perform Calculations ---> <cfset actualLumens = ((actualVolts/lampVolts)^3.4)*lumens> <cfset lumenPercent = actualLumens/lumens*100> <cfset hours = ((lampVolts/actualVolts)^13)*life> <cfset hourPercent = hours/life*100> <cfset actualWatts = ((actualVolts/lampVolts)^1.3)*watts> <cfset wattPercent = actualWatts/watts*100> <cfset temperature = ((actualVolts/lampVolts)^.42)*colorTemp> <cfset tempReduction = temperature-colorTemp> <!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=utf-8" /> <title>Untitled Document</title> </head> <body> <cfsavecontent variable="calculations"> <table> <cfoutput> <tr> <td>Lamp Rated Voltage:</td> <td>#lampVolts#</td> </tr> <tr> <td>Socket Application Voltage:</td> <td>#actualVolts#</td> </tr> <tr> <td id="lumens">Percent of Lumens Used:</td> <td>#round(lumenPercent)#%</td> </tr> <tr> <td>New Rated life in Percentages:</td> <td>#round(hourPercent)#%</td> </tr> <tr> <td>Percent of Watts Used:</td> <td>#round(wattPercent)#%</td> </tr> <tr> <td>Change in Temperatu </td> <td>#round(tempReduction)#°</td> </tr> </cfoutput> </table></cfsavecontent> </body> </html> Again, the url variable says it is undefined. But the variable "lamp" contains the form field value. Thanks for any help and tips in advance! I'm building a website to catalog a history of college football uniforms, and having something like this on several of the pages would be extremely helpful. I've been told that making it in Javascript instead of Flash would be better for my website. I've also been told that it should be relatively easy to write the code for it. In short, I want to be able to take the parts of this image and allow viewers of the site to be able to switch between parts to mix and match. There are quite a few teams with six or more possible uniform combinations, so I'd like to be able to do this for the site. This would probably be a good way to get my start on learning at least some Javascript basics, so would anyone be willing to help me put this together? This may seem a long shot, but 5 years ago I found a script that had everything (not just alpha, etc, but everything). I have looked at Jquery validation and while it is robust, many of the examples were bugged. I am no coder, and I feel like I may be torched here for wasting precious space. However, I was really hoping you all could point me in a right direction. Perhaps if not java, with something else. Paid, Donate, Free. Anything. (The only script I have on form now is just Auotab next/prev plugin for jquery) Function required: Inline on change/next type matching (confirm email/pw fields) basic formatting (numeric only, alpha with spaces, etc) Basic validation of email type expressions, etc Required fields, etc However, I would love to take it a step further Email: Checks for valid TLD Password: sctricter requirements Phone: Requires legitimate values (not just numeric); ie: 201-999, no 555, 411,611,911, etc Date of birth: Checks valid ranges of dates entered; checks min/max age requirement Possible real time database or web services checks (which would be ajax, etc im sure) custom number values (ie, for credit cards, number must be xxxx-xxxx (not 0000-1111-2222-3333 Any other possible logical info, for instance, Name not in badnames list (like Fred Flinstone, IP Freely, or other Cuss words/phrases) Yes, I know most of these would wind up as a server side reject on the submit page, where we could possibly recapture the data. However, that type of method typically lowers conversions. Yes, there is the Jquery plugin, and with knowhow, you can make it do this, however I dont have the knowhow and would rather donate/pay for something already out of the box. The use for this would be contact forms, profile forms, info requests, sales pages, I need javascript event calendar sourcecode with highlighting of colors when dates selecting from datepicker of DHTMLgoodies calendar Hi All I have this basic auto complete JavaScript that works well, but you need to hard code the web page. What I'm trying to do is send the "Autocomplete" variable data to the page using a perl script the working JavaScript code looks like this: var CustomArray=new Array('an apple','alligator','elephant','pear','kingbird','kingbolt','kingcraft','kingcup','kingdom','kingfish er','kingpin','SML'); Now the new code is: var CustomArray=new Array(Autocomplete); And the Perl script is sending back the data to the browser looking like this: var Autocomplete = 'an apple','alligator','elephant','pear','kingbird','kingbolt','kingcraft','kingcup','kingdom','kingfish er','kingpin','SML' I cant seem to get it to work rite full HTML code is below any help is appreciated. HTML: <html> <head> <script language="javascript" type="text/javascript" src="http://www.comicinvasion.com/Code/Java/Autocomplete/Autocomplete.js"></script> <script language="javascript" type="text/javascript" src="http://www.comicinvasion.com/Code/Java/Autocomplete/Common.js"></script> <script language="JavaScript1.2" type="text/javascript" src="http://www.ComicInvasion.com/cgi-bin/Autocomplete.pl"></script> <script> var CustomArray=new Array(Autocomplete); </script> </head> <body> <input type='text' style='font-family:verdana;width:300px;font-size:12px' id='ACMP' value=''/> <script> var obj = actb(document.getElementById('ACOMP'),CustomArray); </script> </body> </html> Every year or two, I want to do something SIMPLE via JS, and each time it's like i've never been there before I simply want a button to show/hide something on click, and I THINK I'm close, but it's not quite working. Here's what I'm toying with. Code: <html> <head> <script type="text/javascript"> function showHide("idName") { if(document.getElementById("idName").style.visibility=="hidden") { document.getElementById("idName").style.visibility=="visible"; } else { document.getElementById("idName").style.visibility=="hidden"; } } </script> </head> <body> <button type="button" onclick="showHide(1)">Click Me!</button> <div id="1" "style=visibility:hidden;"><p>this is the stuff.</p></div> </body> </html> How do I get the button to make that div (in)visible?? ~Mo I have this idea that I want to do basically a "state capture" of a web page through javascript. Basically, a user will click a button, and the script will run, capturing all objects and their styles in a way that can be recreated later without referencing external CSS files and images. The script could export HTML or JS, but obviously all images would have to be data urls and all styles would have to be inline/hard coded. Does anyone know of a tool that do this or have any advice on where I would start? I'm thinking it would be very useful for a bug report submission on an application I'm working on. Sure, the user can upload a screenshot, but I'm trying to save them the step (and basically have a screenshot on every bug report). JS cannot do an actual image capture, so I think a full dom export would be just as good. Any ideas would be fantastic. I am trying to trigger one custom function or another, depending on whether a radio button is checked or not. How can this be done? (I was hoping that "self" would be the ticket, but I think I was barking up the wrong tree.) Code: function toggleFieldsetByRadio(element){ if(SELF.checked){ enable(element); }else{ disable(element); } } How should I do this? I am hoping to use this function with an onchange event. ~ Mo Hello! I need some help here. I need to pre-populate a name and a phone number box based on what's entered in the employee id box. By entering in the employee id - EMPLOYEE ID: [JOHN R] It automatically fills in - Employee Name: [John Roberts] Employee Phone: [1234567890] Thanks. epic thread title! Right I have a process page in php which is fairly long and complex with many options. If a certain option case is met as this ie: we've hit the Note Saved case. PHP Code: // save notes against company if ($_POST['a']=="Save Note") { if (addnote($_POST['notetitle'],$_POST['notebody'])) { $err = "<p id=\"returnresults\"><font color=\"red\"><strong>Note Saved</strong></font></p>"; } else { $err = "<p id=\"returnresults\"><font color=\"red\"><strong>Failed to save note.</strong></font></p>"; } } I want to then wait until the page load is complete and then do the following. PHP Code: document.getElementById('addevent').style.display='block'; The reason I need to wait for page complete is that the div that needs to be displayed it one of the last parts of the page rendered so triggering the above too soon leads to the div not actually being available to be shown. Now my current fail attempt at doing it was this PHP Code: echo "<script type=\"text/javascript\">if (confirm('You have not yet added a call back event do you wish to do so now?')) { document.getElementById('addevent').style.display='block'; } However it doesn't display the hidden div like i want it to as it holds the page rendering off until the confirm is completed are there any suggestions of better ways or should I say CORRECT says of doing this. |