JavaScript - Ie Error, Code Works In All Other Browsers
Hi, I'm having problems tracking down the code that causes IE to throw an error where all other browsers work just fine. I have attached the menu.js file, two style sheets (one for IE, the other for all browsers, css code for menu is at the end), and a body.html file that calls the menu. Of course these are uploaded as text files, but please feel free to rename and run the body file!
The IE error states that it's looking for an object after the script tag on line 18 of the body file that creates menu settings. What is wrong with this line, and how can I fix it? Many thanks for any help that can be provided! Similar TutorialsI am trying to set up some code to control a mouseover popup image. I have the script that works except in certain browsers the results are different. This is the page: http://www.huguenotbats.com/redesignfiles/team.php (just mouse over the first players name). Here is the script: Code: <script type="text/javascript"> function ShowPopup(hoveritem) { hp = document.getElementById("hoverpopup"); // Set position of hover-over popup hp.style.top = hoveritem.offsetTop +115; hp.style.left = hoveritem.offsetLeft +450; //Set popup to visible hp.style.visibility = "Visible"; } function HidePopup() { hp = document.getElementById("hoverpopup"); hp.style.visibility = "Hidden"; } </script> And here is the html code: Code: <tr> <td width="10%" align="center"> 1 </td> <td width="45%" align="center"> <a id="hoverover" style="cursor:default;" onMouseOver="ShowPopup(this);" onMouseOut="HidePopup();" href="bio/amentbio.php" target="_blank" onClick="window.open('bio/amentbio.php','Ryan Ament Bio','height=431,width=649,toolbar=no,directories=no,status=no,menubar=no,scrollbars=no,resizable=no'); return false;"> Ryan Ament </a> <div id="hoverpopup" style="visibility:hidden; position:absolute; top:100; left:350;"><img src="bio/amentthumb.png"></div> </td> </tr> The problem is this: When tested on a Mac (running OS X 10.3.9) in Opera the result is perfect in Safari the popup image is too far down and to the left in IE the script causes an error (Invalid procedure call or argument @ Line 13) When tested on a PC (running XP Home Service Pack 3) in Opera the result is perfect in IE the image is only a tiny bit too far down I can't find any rhyme or reason as to what the problem is or how to fix it (I'm still fairly new to JavaScript) but I really need to get this fixed the best I can so that the site redesign can be submitted to my client. Any help would be much appreciated. Crystal I have a function which allows the number of buttons selected depending on the number selected from the drop down menu. Problem is that this code works in all of the major browsers except for Internet Explorer (No Suprise). For example if user chose the number 3 from the dropdown menu, then user can only select 3 buttons. Why is it not working in Internet explorer and what can be used to make it work in Internet Explorer? Below is javascript functions: Code: function getButtons() { document.getElementById("answerA").class="answerBtnsOff"; document.getElementById("answerA").setAttribute("class","answerBtnsOff"); document.getElementById("answerA").setAttribute("className","answerBtnsOff"); document.getElementById("answerB").class="answerBtnsOff"; document.getElementById("answerB").setAttribute("class","answerBtnsOff"); document.getElementById("answerB").setAttribute("className","answerBtnsOff"); document.getElementById("answerC").class="answerBtnsOff"; document.getElementById("answerC").setAttribute("class","answerBtnsOff"); document.getElementById("answerC").setAttribute("className","answerBtnsOff"); document.getElementById("answerD").class="answerBtnsOff"; document.getElementById("answerD").setAttribute("class","answerBtnsOff"); document.getElementById("answerD").setAttribute("className","answerBtnsOff"); document.getElementById("answerE").class="answerBtnsOff"; document.getElementById("answerE").setAttribute("class","answerBtnsOff"); document.getElementById("answerE").setAttribute("className","answerBtnsOff"); currenttotal=0; } function btnclick(btn) { if(document.getElementById("numberDropId").value=="") { alert('You must first select the number of answers you require from the drop down menu'); return false; } if (btn.class=="answerBtnsOn") { btn.class="answerBtnsOff"; btn.setAttribute("class","answerBtnsOff"); btn.setAttribute("className","answerBtnsOff"); currenttotal--; return false; } if(document.getElementById("numberDropId").value==currenttotal) { alert('You are not allowed beyond the limit of the number of answers you require, deselect other button'); return false; } if (btn.class=="answerBtnsOff") { btn.class="answerBtnsOn"; btn.setAttribute("class","answerBtnsOn"); btn.setAttribute("className","answerBtnsOn"); currenttotal++; return false; } } If you html code then this is below: Code: <form id="enter" action="<?php echo htmlentities($_SERVER['PHP_SELF']); ?>" method="post" onsubmit="return validateForm(this);" > <table id="middleDetails" border="1"> <tr> <td>Question:</td> <td rowspan="3"> <textarea rows="5" cols="40" name="questionText"></textarea> </td> <td>Option Type:</td> <td> <select name="optionDrop" onClick="getDropDown()"> <option value="">Please Select</option> <option value="abc">ABC</option> <option value="abcd">ABCD</option> <option value="abcde">ABCDE</option> <option value="trueorfalse">True or False</option> <option value="yesorno">Yes or No</option> </select> </td> <tr> <td colspan="2"></td> <td>Number of Answers:</td> <td> <span id="na">N/A</span> <select name="numberDrop" id="numberDropId" onChange="getButtons()"> <option value=""></option> <option value="1">1</option> <option value="2">2</option> <option value="3">3</option> <option value="4">4</option> </select> </td> </tr> </table> </form> Any ideas on how I can make this work in IE as well?? It is a code that shows a divide on click and then hides the rest at the same time. live code is also at chryscreations.com/ns/boynames.html Javascript: Code: function showstuff(divID) { els=document.getElementsByName('mydiv') for (var i = 0; i < els.length; i++) { els[i].style.visibility="hidden"; els[i].style.display="none"; } document.getElementById(divID).style.visibility="visible"; document.getElementById(divID).style.display="block"; } HTML Code: <head> <script> window.onload=function() { showstuff(''); } </script> </head> <body> <a href="javascript:showstuff('adivide')">A</a> <a href="javascript:showstuff('bdivide')">B</a> <div name="mydiv" id="adivide"></div> <div name="mydiv" id="bdivide"></div> <body> I have this form which works perfectly in Internet Explorer, but doesn't work in anything else: Code: <FORM NAME=FORMUNIT METHOD=POST ACTION="unit.<%ScriptType%>"> <TD VALIGN="MIDDLE"> <INPUT TYPE=HIDDEN NAME=UserID VALUE="<%UserID%>"> <INPUT TYPE=HIDDEN NAME=Password VALUE="<%Password%>"> <INPUT TYPE=HIDDEN NAME=UnitID VALUE="<%UnitID%>"> <%If IsDevel%> <A style="width:250;text-decoration:none;background-color:cyan;" oncontextmenu="javascript:mouseClicked(<%CourseID%>,<%UnitID%>);" onclick="javascript:submit();" HREF="#"> <%Unit%></A> <%Else%> <A style="width:250;text-decoration:none;background-color:<%If UnitStarted%><%If UnitCompleted%>F84A18<%Else%>orange<%EndIf%><%Else%>10F0A0<%EndIf%>;" onclick="javascript:submit();" HREF="#"> <%Unit%></A> <%EndIf%> </TD> </FORM> I realise all the variables will mean nothing to you, but is there an obvious way to make the script cross-browser compliant? In, say, Firefox, the only thing that is submitted is the "#" in HREF="#". I'm using a nice little script which replaces the usual file upload input with whatever image you want and then with JS makes sure that an invisible 'browse' button is underneath the mouse pointer whenever the mouse is moved over the image you want to use. Nice It works on every browser ie7 ie8 ie9 FF safari chrome but not on opera. On Opera the regular file input appears. I've had a good hoke round the 'net and I know there's loads of scripts which do similar things. But either they are too complicated for me to figure out how to use them eg uploadify (bit of a newbie) or they do similar things but just not as well - like making the custom image the same size as the file input would be (there's issues with that too). here's the script I'm using - there's not much to it How come it doesn't work in Opera grrrr... Is there anyway to fix it? This is perfect for what I want apart from not working in Opera Hello Everbody, I have been at this problem for 10 hours now and am going NUTS!! I am making website to look around an ancient Egyptian Tomb. Feel free to have a look: http://www.campbelltest.co.uk/britishMuseum/online/ I have a flash movie which I have scripted to utilise the browser back button using this script http://www.asual.com/swfaddress/docs/. This works fine until open a lightbox image form within the flash movie using Lokesh Dhakar Light box http://www.lokeshdhakar.com/projects/lightbox2/ and the browsers back button stops working!! The code below is to the JavScript links and the code that lauches the lightbox: Code: <script type="text/javascript" src="js/swfaddress-optimizer.js"></script> <script type="text/javascript" src="js/swfobject.js"></script> <script type="text/javascript" src="js/swfaddress.js"></script> <script type="text/javascript" src="js/swfmacmousewheel.js"></script> <script src="js/prototype.js" type="text/javascript"></script> <script src="js/scriptaculous.js?load=effects" type="text/javascript"></script> <script src="js/lightbox.js" type="text/javascript"></script> <!-- start | JC --> <!-- added for flash --> <!-- added for launch from flash --> <script language="JavaScript"> function openLightbox(url,group){ var objLink = document.createElement('a'); objLink.setAttribute('href',url); objLink.setAttribute('rel','lightbox['+group+']'); objLink.setAttribute('title','caption'); Lightbox.prototype.start(objLink); } </script> <!-- end | JC --> This code is how I have embeded the flash in the page: Code: <script type="text/javascript"> var so = new SWFObject('container04.swf', 'container04', '760', '450', '8', '#ffffff'); so.useExpressInstall('js/expressinstall.swf'); so.addParam('menu', 'false'); //so.addParam('movie','container04'); so.write('flashcontent'); var macmousewheel = new SWFMacMouseWheel( so ); </script> I have added a text box to movie that shows the back button function exicuting and what its exicuting. I have never done any work with JavaScript before so I am up the creek without a paddle!! Ok guys if you look at this page www.runningprofiles.com/members/shout/view.php my code works great.... But when i add it to the rest of the script the code wont work shows he http://www.runningprofiles.com/membe...ll_Script.php# Below is view.php (the one that works) and the one added to the code scirpt is the one the does not. PHP Code: <script type="text/javascript" src="http://ajax.googleapis.com/ajax/ libs/jquery/1.3.0/jquery.min.js"></script> <script type="text/javascript"> $(function() { $(".view_comments").click(function() { var ID = $(this).attr("id"); $.ajax({ type: "POST", url: "viewajax.php", data: "msg_id="+ ID, cache: false, success: function(html){ $("#view_comments"+ID).prepend(html); $("#view"+ID).remove(); $("#two_comments"+ID).remove(); } }); return false; }); }); </script> <ol> <?php //Here $id is main message msg_id value. $csql=mysql_query("select * from comments where msg_id_fk='130' order by com_id "); $comment_count=mysql_num_rows($csql); if($comment_count>2) { $second_count=$comment_count-2; ?> <div class="comment_ui" id="view130"> <a href="#" class="view_comments" id="130">View all <?php echo $comment_count; ?> comments</a> </div> <?php } else { $second_count=0; } ?> <div id="view_comments130"></div> <div id="two_comments130"> <table width="30%"> <?php $small=mysql_query("select * from comments where msg_id_fk='130' order by com_id limit $second_count,2 "); while($rowsmall=mysql_fetch_array($small)) { $c_id=$rowsmall['com_id']; $comment=$rowsmall['comment']; ?> <div class="comment_actual_text"> <tr> <td style="BORDER-RIGHT: black 1px solid; BORDER-TOP: black 1px solid; BORDER-LEFT: black 1px solid; BORDER-BOTTOM: black 1px solid" valign="top"> <table style="WIDTH: 100%; BORDER-COLLAPSE: collapse" align="left"> <tr> <td width="5%" style="VERTICAL-ALIGN: middle; TEXT-ALIGN: center"><img style="WIDTH: 30px; HEIGHT: 30px" alt="srinivas" src="http://www.gravatar.com/avatar.php?gravatar_id=7a9e87053519e0e7a21bb69d1deb6dfe" border="1" /></td> <td style="VERTICAL-ALIGN: top; TEXT-ALIGN: left"> <strong>Jarratt</strong> <?php echo $comment; ?> <br /><span style="COLOR: #a9a9a9">10 min ago - ID = <?php echo $c_id;?> </span></td> </tr> </table><br /> </td> </tr> </div> <?php } ?> </table> </div> </ol> Facebook_Wall_Script.php PHP Code: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> <title>9lessons Applicatio Demo</title> <link href="frame.css" rel="stylesheet" type="text/css"> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.0/jquery.min.js"></script> <script type="text/javascript" src="jquery.oembed.js"></script> <script type="text/javascript"> <script type="text/javascript"> $(function() { $(".view_comments").click(function() { var ID = $(this).attr("id"); $.ajax({ type: "POST", url: "../viewajax.php", data: "msg_id="+ ID, cache: false, success: function(html){ $("#view_comments"+ID).prepend(html); $("#view"+ID).remove(); $("#two_comments"+ID).remove(); } }); return false; }); }); $(function() { $(".comment_button").click(function() { var element = $(this); var boxval = $("#content").val(); var dataString = 'content='+ boxval; if(boxval=='') { alert("Please Enter Some Text"); } else { $("#flash").show(); $("#flash").fadeIn(400).html('<img src="ajax.gif" align="absmiddle"> <span class="loading">Loading Update...</span>'); $.ajax({ type: "POST", url: "update_ajax.php", data: dataString, cache: false, success: function(html){ $("ol#update").prepend(html); $("ol#update li:first").slideDown("slow"); document.getElementById('content').value=''; $('#content').value=''; $('#content').focus(); $("#flash").hide(); $("#expand_url").oembed(boxval); } }); } return false; }); / Delete Wall Update $('.delete_update').live("click",function() { var ID = $(this).attr("id"); var dataString = 'msg_id='+ ID; var parent=$("#bar"+ID); jConfirm('Are you sure you want to delete this message?', 'Confirmation Dialog', function(r) { if(r==true) { $.ajax({ type: "POST", url: "delete_update.php", data: dataString, cache: false, success: function(html){ parent.slideUp(300,function() { parent.remove(); }); } }); } }); return false; });//comment slide $('.comment').live("click",function() { var ID = $(this).attr("id"); $(".fullbox"+ID).show(); $("#c"+ID).slideToggle(300); return false; }); //commment Submint $('.comment_submit').live("click",function() { var ID = $(this).attr("id"); var comment_content = $("#textarea"+ID).val(); var dataString = 'comment_content='+ comment_content + '&msg_id=' + ID; if(comment_content=='') { alert("Please Enter Comment Text"); } else { $.ajax({ type: "POST", url: "comment_ajax.php", data: dataString, cache: false, success: function(html){ $("#commentload"+ID).append(html); document.getElementById("textarea"+ID).value=''; $("#textarea"+ID).focus(); } }); } return false; }); // Delete Wall Update $('.delete_update').live("click",function() { var ID = $(this).attr("id"); var dataString = 'msg_id='+ ID; var parent=$("#bar"+ID); jConfirm('Are you sure you want to delete this message?', 'Confirmation Dialog', function(r) { if(r==true) { $.ajax({ type: "POST", url: "delete_comment.php", data: dataString, cache: false, success: function(html){ $("#comment"+ID).slideUp(); } }); } return false; }); return false; }); </script> <style type="text/css"> body { font-family:Arial, Helvetica, sans-serif; font-size:12px; } .update_box { background-color:#D3E7F5; border-bottom:#ffffff solid 1px; padding-top:3px } a { text-decoration:none; color:#d02b55; } a:hover { text-decoration:underline; color:#d02b55; } *{margin:0;padding:0;} ol.timeline {list-style:none;font-size:1.2em;}ol.timeline li{ display:none;position:relative; }ol.timeline li:first-child{border-top:1px dashed #006699;} .delete_button { float:right; margin-right:10px; width:20px; height:20px } .cdelete_button { float:right; margin-right:10px; width:20px; height:20px } .feed_link { font-style:inherit; font-family:Georgia; font-size:13px;padding:10px; float:left; width:350px } .comment { color:#0000CC; text-decoration:underline } .delete_update { font-weight:bold; } .cdelete_update { font-weight:bold; } .post_box { height:55px;border-bottom:1px dashed #006699;background-color:#F3F3F3; width:499px;padding:.7em 0 .6em 0;line-height:1.1em; } #fullbox { margin-top:6px;margin-bottom:6px; display:none; } .comment_box { display:none;margin-left:90px; padding:10px; background-color:#d3e7f5; width:300px; height:50px; } .comment_load { margin-left:90px; padding:10px; background-color:#d3e7f5; width:300px; height:30px; font-size:12px; border-bottom:solid 1px #FFFFFF; } .text_area { width:290px; font-size:12px; height:30px; } #expand_box { margin-left:90px; margin-top:5px; margin-bottom:5px; } embed { width:200px; height:150px; } </style> </head> <body> <?php include '../../../settings.php'; ?> <div align="center"> <table cellpadding="0" cellspacing="0" width="500px"> <tr> <td> <div align="left"> <form method="post" name="form" action=""> <table cellpadding="0" cellspacing="0" width="500px"> <tr><td align="left"><div align="left"> <h3>What are you doing?</h3></div></td></tr> <tr> <td style="padding:4px; padding-left:10px;" class="update_box"> <textarea cols="30" rows="2" style="width:480px;font-size:14px; font-weight:bold" name="content" id="content" maxlength="145" ></textarea><br /> <input type="submit" value="Update" id="v" name="submit" class="comment_button"/> </td> </tr> </table> </form> </div> <div style="height:7px"></div> <div id="flash" align="left" ></div> <ol id="update" class="timeline"> </ol> <div id='old_updates'> <?php $small=mysql_query("select * from messages2 order by msg_id desc LIMIT 5"); while($r=mysql_fetch_array($small)) { $id=$r['msg_id']; $msg=$r['message']; ?> <div align="left" class="post_box"> <span style="padding:10px"><?php echo $msg.'....'.$id; ?> </span> </div> <ol> <?php //Here $id is main message msg_id value. $csql=mysql_query("select * from comments where msg_id_fk='$id' order by com_id "); $array = mysql_fetch_assoc($csql); $comment_count=mysql_num_rows($csql); if($comment_count>2) { $second_count=$comment_count-2; ?> <div class="comment_ui" id="view<?php echo $id; ?>"> <a href="#" class="view_comments" id="<?php echo $id; ?>">View all <?php echo $comment_count; ?> comments</a> </div> <?php } ?> <div id="view_comments<?php echo $id; ?>"></div> <div id="two_comments<?php echo $id; ?>"> <table width="50%"> <?php $small2=mysql_query("select * from comments where msg_id_fk='$id' order by com_id limit 2 "); while($rowsmall22=mysql_fetch_array($small2)) { $c_id=$rowsmall22['com_id']; $comments=$rowsmall22['comment']; ?> <div class="comment_actual_text"> <tr> <td style="BORDER-RIGHT: black 1px solid; BORDER-TOP: black 1px solid; BORDER-LEFT: black 1px solid; BORDER-BOTTOM: black 1px solid" valign="top"> <table style="WIDTH: 100%; BORDER-COLLAPSE: collapse" align="left"> <tr> <td width="5%" style="VERTICAL-ALIGN: middle; TEXT-ALIGN: center"><img style="WIDTH: 30px; HEIGHT: 30px" alt="srinivas" src="http://www.gravatar.com/avatar.php?gravatar_id=7a9e87053519e0e7a21bb69d1deb6dfe" border="1" /></td> <td style="VERTICAL-ALIGN: top; TEXT-ALIGN: left"> <strong>Jarratt</strong> <?php echo $comments; ?> <br /><span style="COLOR: #a9a9a9">10 min ago - ID = <?php echo $c_id.'...'.$id;?> </span></td> </tr> </table><br /> </td> </tr> </div> <?php } ?> </table> </div> </ol> <?php } ?> </div> </td> </tr> </table> </div> </body> </html> I could use some help getting the following code to work... As is, it works fine in google chrome, but not at all in Internet Explorer 9. If I paste my code into w3schools "tryit" window, it will work great if it has less than 6 rows, any more and I get a generic "ERROR" on the screen. javascript code Code: <script type="text/javascript"> Number.prototype.formatMoney = function(c, d, t){ var n = this, c = isNaN(c = Math.abs(c)) ? 2 : c, d = d == undefined ? "," : d, t = t == undefined ? "." : t, s = n < 0 ? "-" : "", i = parseInt(n = Math.abs(+n || 0).toFixed(c)) + "", j = (j = i.length) > 3 ? j % 3 : 0; return s + (j ? i.substr(0, j) + t : "") + i.substr(j).replace(/(\d{3})(?=\d)/g, "$1" + t) + (c ? d + Math.abs(n - i).toFixed(c).slice(2) : ""); }; function getRowCount() { return document.getElementById('myTable').rows.length; } function changeContent() { var lastRow = getRowCount(); var colSum=0; for(var e=1;e<=lastRow;e++){ var x=document.getElementById('myTable').rows[e].cells; p1=document.getElementById('p'+e).value; q1=document.getElementById('q'+e).value; outint = p1*q1; var out='<input type="text" value="'+Number(outint).formatMoney(2, '.', ',')+'" disabled="disabled">'; x[3].innerHTML=out; } } </script> html code Code: <table width="600" border="1"> <tr> <td>Item Name</td> <td>Price per unit</td> <td>Number of Units</td> <td>Total Price</td> </tr> <tr> <td>Item 1</td> <td><input type="text" id="p1" value="8.3930" disabled="disabled"></td> <td><input type="text" id="q1" value="0" onchange="changeContent()"></td> <td><input type="text" id="t1" value="0" disabled="disabled"></td> </tr> <tr> <td>Item 2</td> <td><input type="text" id="p2" value="8.3380" disabled="disabled"></td> <td><input type="text" id="q2" value="0" onchange="changeContent()"></td> <td><input type="text" id="t2" value="0" disabled="disabled"></td> </tr> <tr> <td>Item 3</td> <td><input type="text" id="p3" value="62.3260" disabled="disabled"></td> <td><input type="text" id="q3" value="0" onchange="changeContent()"></td> <td><input type="text" id="t3" value="0" disabled="disabled"></td></tr> <tr> <td>Item 4</td> <td><input type="text" id="p4" value="124.6630" disabled="disabled"></td> <td><input type="text" id="q4" value="0" onchange="changeContent()"></td> <td><input type="text" id="t4" value="0" disabled="disabled"></td></tr> <tr> <td>Item 5</td> <td><input type="text" id="p5" value="1554.4320" disabled="disabled"></td> <td><input type="text" id="q5" value="0" onchange="changeContent()"></td> <td><input type="text" id="t5" value="0" disabled="disabled"></td> </tr> <tr> <td>Item 6</td> <td><input type="text" id="p6" value="2622.6750" disabled="disabled"></td> <td><input type="text" id="q6" value="0" onchange="changeContent()"></td> <td><input type="text" id="t6" value="0" disabled="disabled"></td></tr> <tr> <td>Item 7</td> <td><input type="text" id="p7" value="4748.8650" disabled="disabled"></td> <td><input type="text" id="q7" value="0" onchange="changeContent()"></td> <td><input type="text" id="t7" value="0" disabled="disabled"></td> </tr> <tr> <td>Item 8</td> <td><input type="text" id="p8" value="23087.9330" disabled="disabled"></td> <td><input type="text" id="q8" value="0" onchange="changeContent()"></td> <td><input type="text" id="t8" value="0" disabled="disabled"></td> </tr> </table> *note* the html table is actually made from a php loop pulling items from a database, but for the sake of simpler troubleshooting I made it a static table for posting here. Please help if you can. Thanks Hello, I hope you can help me, I have used a really simple image script which features 3 thumbnails, you click one thumbnail and it loads the image as a larger image. Works perfectly in Google Chrome, Firefox - and then I've come to try in IE8... works perfect BUT javascript error as follows: - Webpage error details User Agent: Mozilla/4.0 (compatible; MSIE 8.0; Windows NT 6.1; WOW64; Trident/4.0; GTB6.6; SLCC2; .NET CLR 2.0.50727; .NET CLR 3.5.30729; .NET CLR 3.0.30729; Media Center PC 6.0; MDDC; InfoPath.2; .NET4.0C) Timestamp: Fri, 31 Dec 2010 17:14:48 UTC Message: 'document.images.image0' is null or not an object Line: 13 Char: 1 Code: 0 Here is the code, what am I doing wrong? I can't spot it, theres a couple of threads online from 2005 about this script but none have helped me clear the error. Code: <html> <head> <script language="JavaScript"> image0 =new Image(); image1 =new Image(); image2 =new Image(); image0.src ="http://ec.europa.eu/information_society/activities/egovernment/images/project_logos/sample.jpg" image1.src ="http://ec.europa.eu/information_society/activities/egovernment/images/project_logos/sample.jpg" image2.src ="http://ec.europa.eu/information_society/activities/egovernment/images/project_logos/sample.jpg" document.images['image0'].src=image0.src; document.images['image1'].src=image1.src; document.images['image2'].src=image2.src; function image_click(clicks) { if(clicks==0){document.images['large'].src=image0.src;} if(clicks==1){document.images['large'].src=image1.src;} if(clicks==2){document.images['large'].src=image2.src;} } </script> </head> <body> <a href="javascript:image_click(0)"><img src="http://ec.europa.eu/information_society/activities/egovernment/images/project_logos/sample.jpg" height="93" width="123" alt="" name="image0" border="0"/></a> <a href="javascript:image_click(1)"><img src="http://ec.europa.eu/information_society/activities/egovernment/images/project_logos/sample.jpg" width="123" alt="" name="image1" border="0"/></a> <a href="javascript:image_click(2)"><img src="http://ec.europa.eu/information_society/activities/egovernment/images/project_logos/sample.jpg" height="93" width="123" alt="" name="image2" border="0"/></a> <img src="http://ec.europa.eu/information_society/activities/egovernment/images/project_logos/sample.jpg" align="middle" border="0" width="418" height="284" name="large"> </body> </html> The following piece of code produces errors and will not validate at W3 validator.. It can be seen in action here. I am not good with JS and any help will be appreciated PS It selects a png according to the time slot. Frank Code: function greet() { var hour = (new Date()).getHours(); var when = (hour > 21) ? "night" :(hour > 17) ? "evening" : ( (hour > 11) ? "afternoon" : "morning" ); document.write('<img src="' + when + '.png" alt="Good ' + when + '"n');} I'm just starting JavaScript and wrote a quick script for Next/Back buttons for a page showing a family outing on our boat. I proudly uploaded the webpage and emailed it out, but people running IE are unable to use the buttons, they simply do nothing. Here is the .js file, I don't think anything in the HTML or CSS is causing the issue but could post those as well if necessary. Code: var step = 1; //preload images var numImages = 13; var images = new Array( numImages ); var i = 0; for ( i = 0; i < numImages; i++ ) { images[i] = new Image(); images[i].src = "images/boat" + ( i + 1 ) + ".jpg"; } function back() { if( step > 1 ) { step--; } else { step = numImages; } document.images.slide.src = images[step-1].src; } function next() { if( step < numImages ) { step++; } else { step = 1; } document.images.slide.src = images[step-1].src; } function init() { document.getElementById("back").onclick = back; document.getElementById("next").onclick = next; } window.onload = init; I've checked a lot of sites and can't figure this one out. Also, if I'm practicing any bad coding techniques, I'm open to suggestions on that as well Hiya, For school we programmed a game in JavaScript. We uploaded it to the school site (http://graphics.cs.wisc.edu/Courses/...spacewars.html) where it works the way it should. (In Firefox; other browsers don't work as well.) However, I'm trying to upload the exact same code to my own website (http://www.tessaverbruggen.nl/Games/...spacewars.html), where for some reason it refuses to run and instead crashes the browser. To me it seems like it's stuck in some sort of while-loop. If I run it locally, it works fine (once again, in Firefox, after changing some settings in Firefox). I program regularly, but I rarely do things web-related. So all the website related stuff was done by others. Which means I have absolutely no idea where to even start debugging. Theoretically it shouldn't be anything in the code as it's the exact same code, and it also runs locally... Could it be some setting on my website/server? If not, what could it possibly be/where should I look? Thanks! Hi, I've written a small script for a website, and strangely enough (or maybe not) it works in Firefox and Chrome but not IE. I'd read about block level inside inline causing this but i'm still not entirely sure. Here is the offending script: Code: function changeImage(image) { if (image == 6) { var vid = document.createElement('object'); vid.width = "700"; vid.height = "370"; vid.id = "photo"; vid.innerHTML = '<param name="movie" value="http://www.youtube-nocookie.com/v/g4cpDgGlFng&hl=en_US&fs=1&rel=0"></param><param name="allowFullScreen" value="true"></param><param name="allowscriptaccess" value="always"></param><embed src="http://www.youtube-nocookie.com/v/g4cpDgGlFng&hl=en_US&fs=1&rel=0" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="700" height="370"></embed>'; document.getElementById("body").replaceChild(vid, document.getElementById("photo")); } else { var img = document.createElement('img'); var old = document.getElementById("photo") img.width = "700"; img.height = "370"; img.id = "photo"; img.alt = "Photo of Gippsland Lakehous"; img.src = "images/photos/" + image + ".jpg"; document.getElementById("body").replaceChild(img, old); } The offending line is the long innerHTML one. I'm sure this must be a very hacky way of doing things (incidentally the thing is replacing an image with another image or video depending on what is clicked), but I rarely code at all, so don't know any better Thanks! Hi. I am having trouble getting my code to validate for my speed/distance calculator. I have 2 input prompts: 1 for hours and 1 for minutes. The issue is I can put a number for hours (e.g 7) and W for minutes and the result will display distance is NaN, whereas I am expecting it to alert user to input a valid number. The same issue applies if I switch the order of isNan(hours) and isNaN(mins) If you have even the slightest idea of what I have done wrong, or what I am missing I will truly appreciate the input. Thanks! Code: <html> <head> <title>Sound Travel Calculator</title> <script type="text/javascript"> // ?????????????????????????????????????????????????????????????????????????????????????????????????????????????? // the program works pretty well except if i put, lets say 7 hours and w mins then it will say the distance traveled is NaN. but it should be re-prompting to enter hours and mins. It doesn't matter if I switch the order of isNan(hours) and isNaN(mins) // ?????????????????????????????????????????????????????????????????????????????????????????????????????????????? // Setting our variables based on user input var hours = 0; var mins = 0; var m_per_secs = 340; alert("Speed of Sound \n\nAt Sea Level Sound Travels At 340 Metres Per Second \n\nIf You Would Like To Know How many Kilometres sound Will Travel In A Given Time, Click OK"); hours = prompt("Please Enter Hours (If less than 1 hour, just type 0)"); mins = prompt("Please Enter Minutes"); // Validating input for a number less than zero or an not a number while ((isNaN(hours)) || (isNaN(mins)) && (hours < 0) || (mins < 0)) { alert("Please enter a numeric value, zero or greater"); hours = prompt("Please Enter Hours (If less than 1 hour, just type 0)"); mins = prompt("Please Enter Minutes"); } // if there is no input, the value is set to zero if (hours =="") { hours = 0; } if (mins =="") { mins = 0; } // Calculations dist = (((parseFloat(hours)) * 60 * 60) + (parseFloat(mins * 60)) * parseFloat(m_per_secs) / 1000) // Output our calculation alert("The Distance of Sound Travelled is " + (dist) + " Kilometres"); //end program </script> </head> <body> </body> </html> // otherwise search the parent element tempElem=tempElem.parentElement; // return when it reaches the top of the code if(tempElem.tagName=="HTML") { return el; } } return tempElem; } function fixTBpos() { var OCode = document.getElementById('OCode'); var ODiv = document.getElementById('ODiv'); st=document.body; if(isW3Mode) OCode.style.height=ODiv.style.height=st.clientHeight-119; else OCode.style.height=ODiv.style.height=st.clientHeight-113; typeof(toc) == "undefined" ? '':Resizetoc(); } function hasTagsInText(text) { if(text.indexOf("<TABLE") >=0 || text.indexOf("<table") >=0) return 'table';<<<<<<<<NOT WORKING if(text.indexOf("<TD") >=0 || text.indexOf("<td") >=0) return 'column'; if(text.indexOf("<IMG") >=0 || text.indexOf("<img") >=0) return 'image'; if(text.indexOf("<H2") >=0 || text.indexOf("<h2") >=0) return 'h2'; if(text.indexOf("<DIV") >=0 || text.indexOf("<div") >=0) return 'div'; if(text.indexOf("<A") >=0 || text.indexOf("<a") >=0) return 'link'; if(text.indexOf("<FORM") >=0 || text.indexOf("<form") >=0) return 'form'; if(text.indexOf("<P>") >=0 || text.indexOf("<p>") >=0) return 'invisible paragraph-mark'; if(text.indexOf("<BR>") >=0 || text.indexOf("<br>") >=0) return 'invisible new-line-mark'; return ''; } function hasFormatInText(text) { var format = '' if(text.indexOf("id=subtitle") >=0) format+= 'id=subtitle' if(text.indexOf("class=greytext") >=0) format+= 'class=greytext' if(text.indexOf("class=prices") >=0) format+= 'class=prices' if(text.indexOf("class=small") >=0) format+= 'class=small' if(text.indexOf("class=bct") >=0) format+= 'class=bct' // jae added if(text.indexOf("class=price") >=0) format+= 'class=price' if(text.indexOf("class=error") >=0) format+= 'class=error' // to here if(text.indexOf("<BLOCKQUOTE ") >=0 || text.indexOf("<BLOCKQUOTE>") >=0) format+= 'header=blockquote' if(text.indexOf("formatted-text") >=0 || text.indexOf("class=")>=0) format+= 'id=misctext' if(text.indexOf("<SPAN ") >=0 || text.indexOf("<SPAN>") >=0) format+= 'span' if(text.indexOf("<H1 ") >=0 || text.indexOf("<H1>") >=0) format+= 'header=h1' if(text.indexOf("<H2 ") >=0 || text.indexOf("<H2>") >=0) format+= 'header=h2' if(text.indexOf("<H3 ") >=0 || text.indexOf("<H3>") >=0) format+= 'header=h1' if(text.indexOf("<H4 ") >=0 || text.indexOf("<H4>") >=0) format+= 'header=h2' if(text.indexOf("<EM ") >=0 || text.indexOf("<EM>") >=0) format+= 'style=em' if(text.indexOf("<B ") >=0 || text.indexOf("<B>") >=0) format+= 'style=b' if(text.indexOf("<STRONG ") >=0 || text.indexOf("<STRONG>") >=0) format+= 'style=strong' if(text.indexOf("<I ") >=0 || text.indexOf("<I>") >=0) format+= 'style=i' if(text.indexOf("<U ") >=0 || text.indexOf("<U>") >=0) format+= 'style=u' if(text.indexOf("<FONT ") >=0 || text.indexOf("<FONT>") >=0) format+= 'style=font' return format } 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> ............................................................................................. Solved
this code works in google chrome, but not in firefox. Code: function merge(obj1, obj2) { var a ={}; for (var p in obj1) { try { // Property in destination object set; update its value. if ( obj1[p].constructor==Object ) { a[p] = merge(a[p], obj1[p]); } else { a[p] = obj1[p]; } } catch(e) { // Property in destination object not set; create it and set its value. a[p] = obj1[p]; } } for (var p in obj2) { try { // Property in destination object set; update its value. if ( obj2[p].constructor==Object ) { a[p] = merge(a[p], obj2[p]); } else { a[p] = obj2[p]; } } catch(e) { // Property in destination object not set; create it and set its value. a[p] = obj2[p]; } } return a; } var d=function(){'c';} var a ={a:{b:'c'},b:'c'} var b ={c:a,d:d}; var c = merge(window,b); WHY?!?!?!?!?!?!?!?!?!?!?!?!??!?!?!?! Ok so I'm making a limited snipe Bot on ROBLOX.com that basically buys the limited for a price that you input. It works with purchasing the limited. When I enter it in console it immediately buys the limited up for the maximum price or less. But after about 2 -5 seconds it slows down again Please can someone be kind enough to help me out? Code: var xhr = new XMLHttpRequest(); xhr.open("GEThttp://209.15.211.170/catalog/json?b...rue&Category=2, false); xhr.send(); console.log(xhr.status); console.log(xhr.statusText); $("html").html("<h2 style='position:absolute;left:60%;color:#BF34334;font-family:arial;'></h2>"); var minPage = 1; var maxPage = 12; var page = minPage; var json = 'http://209.15.25843811.170/catalog/json?browse&Category=2' var min = 1 var max = Number(prompt("Maximum Robux?")); function buy(item, price) { var link = 'http://209.15.211.170/; $.get(link, function(data) { var info = (data).find('.ItemSalesTable.find('.PurchaseButton').data(); var buy = 'http://www.roblox.com/API/Item.aspx?rqtype=purchase&productID=' + info[productId] + '&expectedcurrency=1&expectedPrice=' + info[expectedPrice] + '&expectedSellerId=' + info[expectedSellerId] + &userAssetID= + info[userassetId]; if (parseInt(info) == parseInt(info['expectedPrice'])) { } }); } setInterval(function() { function get() { $.get(json, function(Data) { for (var Hat & Data { if (max >= Price && Price > 0) { buy(ID, Price) var dt = new Date(); var time = dt.getHours() + ":" + dt.getMinutes() + ":" + dt.getSeconds(); console.info(Name+'['+Price+'] @ '+time); } } }) } get() console.clear(); console.info('Running on pages '+minPage+'-'+maxPage); confirm = function() {}; alert = function() {}; console.clear(); |