JavaScript - Can Anyone Tell Me What's Wrong With This Script?
Similar TutorialsI don't want the images to load until the link is hovered, so for that here is the script but it's not working, can someone help me in correcting it? I added an event listener to each link, and on mouseover called a function that sets the image. To make things more interesting, we can copy lazyload a bit here and also use the data-original property For example: this is the HTML Code: Code: <li> <a href="#" class="tip_trigger"> <img class="tip" alt="300 Grams" data-original="https://lh5.googleusom/-qCRpw.../300%2520.jpg" src='empty.gif' width="90" height="90"/> Alex </a> </li> Then, add an event listener: Code: Code: // call for each element with the class 'tip' that's being hovered upon $('.tip').hover(function() { // retrieve the image inside this element var elem = $(this).find('img'); // set the 'src' to the 'data-original' value elem.attr('src', elem.attr('data-original')); }); for a live demo, you can see this page http://bloghutsbeta.blogspot.com/201...slidernav.html the above part of script is only added to the first letter ALEX in 'A' Category. <script type="text/javascript">document.getElementById("cl").style.display="block";</script> It is line 105 of the "Sources" program in my Signature. It doesn't seem to affect the program, but I would like to put it right. My CSE Validator program tells me that it has something amiss. Frank Hello, I'm trying to get the plus to turn into a minus when you click the list... not sure why it's not working. Could it have to do with the code not being compatible with the latest version of jquery? http://www.dynodealz.com/down/index2.php Hello all , I just start my self-lessons on javascript, it is pretty cool, but i have some trouble understanding some , can any one tell me what's wrong with this code, i would like when the user press the button the windows pop-ups. the code: <html> <head> <title>Hello World</title> <script type="text/javascript" src="script.js"></script> </head> <body> <form action="#"> <input type="button" value="Click Me!" id="hibut" /> </form> </body> </html> -------------------------------------------- function Hibye(){ window.alert('Hello...'); window.alert('Bye'); } var hi_button = document.getElementById('hibut'); hi_button.onclick = Hibye(); Thanks........ Code: var a = 6; var b = 4; var c = 3; if (a = c) { a(a *2)+b; } alert(a); What is the value of "a"? I had this on a test at school today. It's my first class after a brief summer course in javascript ( 5 days). The scritp doesn't make sense to me. Is the syntax and structure even correct? Hello coders, Recently I was in need of an adrotator script which would work on it's own and after some searching I found one. I thought it worked well so I saved it for when I needed it. That time has now come but it turns out there is a small problem with the script. The script is supposed to show two images, say img1 and img2 and point to link1 and link2 respectively. What actually happens is that first it shows img2 but without linking to link2. It actually simply directs you to the page you are already on. After that, it seems the script starts to work as it should. It shows img1 which links to link1 when you click it, and ten seconds later it shows img2 which links to link2 as it should. Then it goes back to img1 as it should and starts again. So basically it works except for that it first shows the wrong image without the right link and only after that it starts working as it should. I hope that explains it properly. You can see how it works for yourself by visiting this page where the ad is on display right now: www.thewayiplay.com/mainforum/index.php The code I am using is this: [CODE] <DIV ALIGN=CENTER> <script type="text/javascript"> var imgs1 = new Array("http://www.thewayiplay.com/mijnplaatjes/rainmanbanner/linkbanner2.png","http://www.thewayiplay.com/mijnplaatjes/bobearlad/bobearl.jpg"); var lnks1 = new Array("http://www.rainman.tv","http://www.bobearlracing.com"); var alt1 = new Array("Rainman","Bob Earl Racing"); var currentAd1 = 0; var imgCt1 = 2; function cycle1() { if (currentAd1 == imgCt1) { currentAd1 = 0; } var banner1 = document.getElementById('adBanner1'); var link1 = document.getElementById('adLink1'); banner1.src=imgs1[currentAd1] banner1.alt=alt1[currentAd1] document.getElementById('adLink1').href=lnks1[currentAd1] currentAd1++; } window.setInterval("cycle1()",10000); </script> <a href=""http://www.bobearlracing.com"" id="adLink1" target="_blank"> <img src="http://www.thewayiplay.com/mijnplaatjes/bobearlad/bobearl.jpg" id="adBanner1" border="0" width="486" height="97"></a>[CODE] Can someone tell me what is wrong with this script? Seeing as it does what it should plus something it shouldn't, would it be as simple as removing a portion of the code? I would really appreciate a correction to the code (or explanation why it isn't working properly) or alternatively I would like a suggestion on a possible alternative. I chose this script because it was standalone and because it was free. Thank you in advance for any help you might be able to offer. Kind regards, Tysmyster I'd like to place an AJAX call to load another SELECT menu in my form, and I'm having trouble finding a tutorial. Can someone point me to a good tute, or provide some guidance/examples here? For your Copying/Pasting pleasure , here's an example button for which I'd include the onclick(): Code: <button type="button" >Add</button> And here's an example SELECT menu: Code: <select id="idNumber" name="weekday_1['workPeriod_new'][] > <option value="1" >one</option> <option value="2" >2</option> </select> Thanks-a-bunch, ~ Mo NOTE: Overall, I'm pretty green in JS. Hi All, I have two scripts which I want to try and integrate. I am using a nice gallery script to show thumbnails which are appended to a an image wrapper which on click of the thumbnail shows the larger image in the image wrapper, I am trying to implement cloud zoom which is a plugin which uses image srcs to then point to an anchor href to show another larger zoom image either in the same place.. which is what I am trying to do or in another div beside. I have had to set me img srcs up in a certain way to easily enter some product details. and I need to try an manipulate the code to make it work to suit my file layout. I am using a var= images [ with a series of file locations and info such as below { src: 'romanticabride/thumbs/tn_Shauna.jpg', srcBig: 'romanticabride/images/Shauna.jpg', title: 'Shauna', longDescription: '<b><H1>Shauna</H1></b><br><b>Romantica Of Devon <br><br><h2>Sizes Available:</h2><br> 6 - 32.<b><br><b><br><b><b><b><H2>Colours Available:</h2><b><br>Various<br>Please Enquire Below<br><br><br><br><a href="mailto:tracy@cherishbridal.co.uk?subject=Web Enquiry Regarding Romantica Shauna Bridal Gown"class="enquiry rose glow" >Click To Enquire About This Item </a>' }, what I need is for cloud zoom to work when the main image wrapper is hovered over which means it will need to add a class or when the whichever srcBig: is hovered over it gets wrapped by href to make the script work . one of my pages is http://www.cherishbridal.co.uk/romaticabride.html the cloud zoom script is at http://www.professorcloud.com/mainsite/cloud-zoom.htm.. I am happy to share a jsfiddle with someone or explain further or post some code. Thank you in advance does any expert know how to pass parameters in the <script ..> tag? for instance; Code: <script type="text/javascript" src="script.js ?param1=val1¶m2=val2&etc "> in the javascript script.js, how would we read the params after the question mark? for example, google this; google shopping cart /v2_2/cart.js I have a script that works in seamonkey(my html editor) but when I use it in IE8 it says errors happen. Here's the code (the first line is on line 7 of the html file): Code: <script type="text/javascript"> function enlarge(imageNum) { var numToString = ""; if(parseInt(imageNum) < 10){ numToString = "0" + imageNum; } else { numToString = imageNum + ""; } window.open("images/LgScreenshot"+numToString+".jpg","Screenshot "+imageNum,"status=0,height=675,width=900,resizable=0"); } </script> And the errors: Webpage error details User Agent: Mozilla/4.0 (compatible; MSIE 8.0; Windows NT 6.0; Trident/4.0; GTB0.0; SLCC1; .NET CLR 2.0.50727; Media Center PC 5.0; .NET CLR 3.5.30729; InfoPath.3; .NET CLR 3.0.30729) Timestamp: Wed, 10 Feb 2010 14:58:16 UTC Message: Object expected Line: 150 Char: 1 Code: 0 URI: http://samssc2site.co.cc/Features.html Message: Invalid argument. Line: 18 Char: 1 Code: 0 URI: http://samssc2site.co.cc/Features.html I need to assign a key in the javascript to actually make the javascript work,. I have a bookmark in chrome , a javascript , which actually works when clicked on it .,. but how can i edit it so that i can actually make it work on click a key or combination of keys. i want to declare the key or keycombo in the script itself .,. the script is for catching the selected text on the webpage and opening a new tab(or window) and doing an exact search search of the selected text using google.com .,., So I want it to work it this way ., select the text press a key and it opens a new tab (or window) with an xact search .,. i want to declare the key or keycombo in the script itself .,. the script is for catching the selected text on the webpage and opening a new tab(or window) and doing an exact search search of the selected text using google.com .,., So I want it to work it this way ., select the text press a key and it opens a new tab (or window) with an xact search .,. Thanks in advance ., Nani First, I am new to javascript... I've been trying to get help on a dynamic menu but no one ever seems to respond... So I will start with the pieces... I do not understand why this chunk of code is not working... All i have is a div and the script is simply supposed to make the div have a new size... here is the script... Code: <script type="text/javascript"> var stretch = 200; function Expand(index) { var dname = "menu" + index; document.getElementById(dname).style.width = stretch+'px'; } </script> here is the styling Code: <style type="text/css"> .show{height:20px; width:100px; display:block; background:lightgreen;} </style> and here is the simple html Code: <div id="menu1" class="show" onclick="runExpand(1)"></div> Hello people, I have just started to dabble in Javascript and for my first 'project' i want to display a popup window in the center of the current browser window. I am usng the following script and when testing it using firefox/mozilla it works really well, however when i test it using Internet Explorer it goes a little wonky. here is my script: function doBubblePopUp(myId, moduleId){ var myWidth = 0, myHeight = 0; if( typeof( window.innerWidth ) == 'number' ) { //Non-IE myWidth = window.innerWidth; myHeight = window.innerHeight; } else if( document.documentElement && ( document.documentElement.clientWidth || document.documentElement.clientHeight ) ) { //IE 6+ in 'standards compliant mode' myWidth = document.documentElement.clientWidth; myHeight = document.documentElement.clientHeight; } else if( document.body && ( document.body.clientWidth || document.body.clientHeight ) ) { //IE 4 compatible myWidth = document.body.clientWidth; myHeight = document.body.clientHeight; } var centerX = parseInt(myWidth / 2) - 225; var centerY = parseInt(myHeight / 2) - 275; i have looked at lots of tutorial and reference sites and with my limited understanding, the above script should work. any help would be gratefully appreciated, document.write('<a href='+'"'+imagelinks[ry]+'"'+' target="_blank"><img src="'+myimages[ry]+'" border=0 max-height="250" max-width="900"></a>') I've looked over this 100 times and can't figure it out. The image shows up and you can click it. The max height and width isn't working and the image isn't opening in a new tab. Any help? first- i wanted to say (for all those who see it before the Mods remove it) how stupid does a bot have to be to set its spam to be resolved at OP? lol so now my question... I have two divs with some styling. Code: #show{CSS code} #menuDet1{CSS code and visibility:hidden;} I then had in html Code: <div id="show" onmouseover="changevis(1)"></div> <div id="me1"></div> and then a function Code: function changevis(index){ acMenuDet="me" + index; document.getElementById(acMenuDet).visibility="visible"; } a colleague of mine helped me "debug" this until it worked and we came up with Code: function details_visible(index) { var acMenuDet = "menuDet" + index; document.getElementById(acMenuDet).style.visibility = "visible"; ; } function details_hidden(index) { var acMenuDet = "menuDet" + index; document.getElementById(acMenuDet).style.visibility = "hidden"; ; } Note: also changed code in div to Code: <div id="show" onmouseover="details_visible(1)" onmouseout="details_hidden(1)"> Hover over me</div> <div id="menuDet1" style="visibility: hidden;" >Plesam Plesam Plesam Plesam Plesam</div> I do not see off the bat what I was doing wrong- anyone else see what I did incorrectly? I realy need help what is wrong with the IF Code: <script type="text/javascript"> function Player(name, xStart, yStart){ this.x = xStart; this.y = yStart; this.name = name; this.walk = playerWalk; this.locate = playerLocate; } var urHere = new Player("You",50,50); function playerWalk(dir){ switch(dir){ case "up": this.y++; break; case "down": this.y--; break; case "left": this.x--; break; case "right": this.x++; break; default: alert("I don't understand: " + dir); } this.locate(); } if (this.y == 50){ document.write ("<h3>Blob Wins!</h3>"); } here is my code Code: <input type="button" onclick='fetch(\"no\", \"wifi.pl?action=connect&network="+document.getElementById(\'networkname\').value+"\");' value="Connect"> no matter how i try the combinations of '"\" i cannot seem to get the element value in the onclick. the fetch('no', 'url'); // no means just send the info and not get results just incase anyone was wondering. is just an ajax query HTML Code: <!DOCTYPE HTML> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <!--META TAGS--> <meta http-equiv="content-type" content="text/html;charset=utf-8" /> <meta name="description" content="The best of the internet all in one place" /> <meta name="keywords" content="Votillity,Homepage,Directory,email,file sharing,financial,games,jobs,language,literature,maps,music,news,politics,pro wrestling,science,shopping,social,networking,sports,travel,tv,movies,videos,calculate,calculator," /> <meta name="author" content="Matthew Chatterton" /> <meta name="google-site-verification" content="iJB8KNduVUeBu7MBY6Jyw7WqxekCCgVgwq_arLQGAZk" /> <meta name="alexaVerifyID" content="vbR_arpXTayIO5B7nHs9BjLOYFE" /> <!--STOP META TAGS--> <!--EXTERNAL FILES--> <link rel="stylesheet" type="text/css" href="css/main.css" /> <link id="altstyle" rel="stylesheet" type="text/css" href="css/main.css" /> <script type="text/javascript" src="main.js"></script> <link rel="shortcut icon" href="http://votillity.com/img/VotillityIcon.ico" /> <link rel="apple-touch-icon" href="http://votillity.com/img/VotillityAppleTouchIcon.png" /> <script type="text/javascript" src="jquery-1.4.2.min.js"></script> <!--STOP EXTERNAL FILES--> <title>Votillity.com</title> <!--CSS INTERNAL--> <!--CSS INTERNAL--> <!--JAVASCRIPT INTERNAL--> <!--JAVASCRIPT INTERNAL--> </head> <body onload="startTime()" style="background:#ffffff;"> <button class="buttontabs" style="position:fixed;top:0;left:0;" onclick="function tabs1()">Tab 1</button> <div> <object id="UUS1" style="width:100%;height:96%;visibility:hidden;" data="http://Votillity.com/Votillity.html"> <embed src="http://Votillity.com/Votillity.html"/> </object> </div> <button class="buttontabs" style="position:fixed;top:0;left:80px;" onclick="function tabs2()">Tab 2</button> <div> <object id="UUS2" style="width:100%;height:96%;visibility:hidden;" data="http://Votillity.com/Votillity.html"> <embed src="http://Votillity.com/Votillity.html"/> </object> </div> <button class="buttontabs" style="position:fixed;top:0;left:160px;" onclick="function tabs3()">Tab 3</button> <div> <object id="UUS3" style="width:100%;height:96%;visibility:hidden;" data="http://Votillity.com/Votillity.html"> <embed src="http://Votillity.com/Votillity.html"/> </object> </div> <button class="buttontabs" style="position:fixed;top:0;left:240px;" onclick="function tabs4()">Tab 4</button> <div> <object id="UUS4" style="width:100%;height:96%;visibility:hidden;" data="http://Votillity.com/Votillity.html"> <embed src="http://Votillity.com/Votillity.html"/> </object> </div> <button class="buttontabs" style="position:fixed;top:0;left:320px;" onclick="function tabs5()">Tab 5</button> <div> <object id="UUS5" style="width:100%;height:96%;visibility:hidden;" data="http://Votillity.com/Votillity.html"> <embed src="http://Votillity.com/Votillity.html"/> </object> </div> <button class="buttontabs" style="position:fixed;top:0;left:400px;" onclick="function tabs6()">Tab 6</button> <div> <object id="UUS6" style="width:100%;height:96%;visibility:hidden;" data="http://Votillity.com/Votillity.html"> <embed src="http://Votillity.com/Votillity.html"/> </object> </div> <button class="buttontabs" style="position:fixed;top:0;left:480px;" onclick="function tabs7()">Tab 7</button> <div> <object id="UUS7" style="width:100%;height:96%;visibility:hidden;" data="http://Votillity.com/Votillity.html"> <embed src="http://Votillity.com/Votillity.html"/> </object> </div> <button class="buttontabs" style="position:fixed;top:0;left:560px;" onclick="function tabs8()">Tab 8</button> <div> <object id="UUS8" style="width:100%;height:96%;visibility:hidden;" data="http://Votillity.com/Votillity.html"> <embed src="http://Votillity.com/Votillity.html"/> </object> </div> <button class="buttontabs" style="position:fixed;top:0;left:640px;" onclick="function tabs9()">Tab 9</button> <div> <object id="UUS9" style="width:100%;height:96%;visibility:hidden;" data="http://Votillity.com/Votillity.html"> <embed src="http://Votillity.com/Votillity.html"/> </object> </div> <p class="counter" style="position: fixed; bottom: -18px; right: 3px;"></p> <span class="time" style="position: fixed; top: 0px; right: 5px; font-weight: 900; color: green;" id="time"></span> </body> </html> Javascript Code: function tabs1() { var tabs1 = [ { document.getElementById('UUS2') }, { document.getElementById('UUS3') }, { document.getElementById('UUS4') }, { document.getElementById('UUS5') }, { document.getElementById('UUS6') }, { document.getElementById('UUS7') }, { document.getElementById('UUS8') }, { document.getElementById('UUS9') } ]; document.tabs1.style.visibility='hidden' document.getElementById('UUS1').style.visibility="visible" } function tabs2() { var tabs2 = [ { document.getElementById('UUS1') }, { document.getElementById('UUS3') }, { document.getElementById('UUS4') }, { document.getElementById('UUS5') }, { document.getElementById('UUS6') }, { document.getElementById('UUS7') }, { document.getElementById('UUS8') }, { document.getElementById('UUS9') } ]; document.tabs2.style.visibility='hidden' document.getElementById('UUS2').style.visibility='visible' } function tabs3() { var tabs3 = [ { document.getElementById('UUS1') }, { document.getElementById('UUS2') }, { document.getElementById('UUS4') }, { document.getElementById('UUS5') }, { document.getElementById('UUS6') }, { document.getElementById('UUS7') }, { document.getElementById('UUS8') }, { document.getElementById('UUS9') } ]; document.tabs3.style.visibility='hidden' document.getElementById('UUS3').style.visibility='visible' } function tabs4() { var tabs4 = [ { document.getElementById('UUS1') }, { document.getElementById('UUS2') }, { document.getElementById('UUS3') }, { document.getElementById('UUS5') }, { document.getElementById('UUS6') }, { document.getElementById('UUS7') }, { document.getElementById('UUS8') }, { document.getElementById('UUS9') } ]; document.tabs4.style.visibility='hidden' document.getElementById('UUS4').style.visibility='visible' } function tabs5() { var tabs5 = [ { document.getElementById('UUS1') }, { document.getElementById('UUS2') }, { document.getElementById('UUS3') }, { document.getElementById('UUS4') }, { document.getElementById('UUS6') }, { document.getElementById('UUS7') }, { document.getElementById('UUS8') }, { document.getElementById('UUS9') } ]; document.tabs5.style.visibility='hidden' document.getElementById('UUS5').style.visibility='visible' } function tabs6() { var tabs6 = [ { document.getElementById('UUS1') }, { document.getElementById('UUS2') }, { document.getElementById('UUS3') }, { document.getElementById('UUS4') }, { document.getElementById('UUS5') }, { document.getElementById('UUS7') }, { document.getElementById('UUS8') }, { document.getElementById('UUS9') } ]; document.tabs6.style.visibility='hidden' document.getElementById('UUS6').style.visibility='visible' } function tabs7() { var tabs7 = [ { document.getElementById('UUS1') }, { document.getElementById('UUS2') }, { document.getElementById('UUS3') }, { document.getElementById('UUS4') }, { document.getElementById('UUS5') }, { document.getElementById('UUS6') }, { document.getElementById('UUS8') }, { document.getElementById('UUS9') } ]; document.tabs7.style.visibility='hidden' document.getElementById('UUS7').style.visibility='visible' } function tabs8() { var tabs8 = [ { document.getElementById('UUS1') }, { document.getElementById('UUS2') }, { document.getElementById('UUS3') }, { document.getElementById('UUS4') }, { document.getElementById('UUS5') }, { document.getElementById('UUS6') }, { document.getElementById('UUS7') }, { document.getElementById('UUS9') } ]; document.tabs8.style.visibility='hidden' document.getElementById('UUS8').style.visibility='visible' } function tabs9() { var tabs9 = [ { document.getElementById('UUS1') }, { document.getElementById('UUS2') }, { document.getElementById('UUS3') }, { document.getElementById('UUS4') }, { document.getElementById('UUS5') }, { document.getElementById('UUS6') }, { document.getElementById('UUS7') }, { document.getElementById('UUS8') } ]; document.tabs9.style.visibility='hidden' document.getElementById('UUS9').style.visibility='visible' } when I click on the buttons, nothing pops up I get the 'Invalid' confirmation but not the 'Valid' one... WHY? It works when I plug in this instead though... if (user.length < 5) 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=utf-8" /> <title>Form Validation</title> </head> <body> <script type="text/javascript"> function checkForm() { var user = document.getElementById('user').value; if (user != "turgeon"){ alert("Invalid Username"); return false; } else{ return true; } } function checkUser() { var user = document.getElementById('user').value; var element = document.getElementById('labelUser'); if(user != "turgeon"){ element.innerHTML = "Invalid Username"; element.style.color = "red"; } else{ element.innerHTML = "Valid Username"; element.style.color = "green"; } } </script> <form onsubmit="return checkForm();"> <input type="text" id="user" onblur="checkUser();" /> <label id="labelUser"></label> <input type="submit" value="submit" /> </form> </body> </html> I'm trying add the value of multiple text boxes automatically using javascript i revised the code many many times but i cant find an error or maybe im missing something you can find the source code in the link below http://wilson382.info/code.html or just download the file so you can revise and test code easily http://wilson382.info/build.zip what I want to do will work exactly like this: http://wilson382.info/src.html The working code of this script i got it from http://javascriptsource.com/ so credit goes to them thank in advance to anyone who try to help. edit: it works fine now but its not giving me the correct result the correct result is 1076 check it out: http://wilson382.info/build.html |