JavaScript - Problem With Javascript Crashing Browser (inefficient?)
Hello again ,
I have another question, I am trying to make a javascript timer that times in tenths of seconds (eg. 1.6 seconds). I have made what I believe to be suitable code but I think that it can't be very effiecient as the code won't run because the browser crashes. Here is the code: Code: function seconds() { while (timergoing=1) { tenthseconds=tenthseconds+1; if (tenthseconds=10) { tenthseconds=0; seconds=seconds+1; } } } function timer() { timergoing=1; tenthseconds=0; seconds=0; setInterval('seconds()', 100); while (timergoing=1) { document.getElementById('timeis').innerHTML = seconds + '.' + tenthseconds + 'seconds'; } } And for the HTML: Code: <button type="button" onclick="timer()">Start</button> <br><br> <div id="timeis"></div> Similar TutorialsHello all. I'm working on a photo upload script. All works well until I added a simple script to get the document body innerHTML so that I could report back to the user if there was any errors or not. So... Code: addEvent($('uploaderIframe'),"load",showLoad); } var showLoad = function() { removeEvent($('uploaderIframe'),"load",showLoad); $('uploaderIframe').src="javascript:window.parent.document.getElementById('uploadInfo').innerHTML = document.body.innerHTML;"; } } It seems that whenever I try to change src of the iframe it crashes. Not to sure why, as I've seen this be done on other Ajax like Photo upload scripts. Can I get some help with this please... Here's the full script: Code: function addEvent(obj, evType, fn){ if(obj.addEventListener) obj.addEventListener(evType, fn, true) if(obj.attachEvent) obj.attachEvent("on"+evType, fn) } function removeEvent(obj, type, fn){ if(obj.detachEvent){ obj.detachEvent('on'+type, fn); }else{ obj.removeEventListener(type, fn, false); } } function ajaxPhotoUploader() { document.getElementById('file_upload_form').onsubmit=function() { if($('uploaderIframe')) { document.getElementById('file_upload_form').removeChild(document.getElementById('uploaderIframe')); } $('uploadInfo').innerHTML = '<img src="./images/ajax-loader.gif" />'; if(window.ActiveXObject) { var iframe = document.createElement("<iframe id=\"uploaderIframe\" name=\"uploaderIframe\" src=\"./uploadto.php\" style=\"width:200px;height:200px;\">"); } else { var iframe = document.createElement("iframe"); iframe.setAttribute("name","uploaderIframe"); iframe.setAttribute("src","./uploadto.php"); iframe.setAttribute("id","uploaderIframe"); } document.getElementById('file_upload_form').appendChild(iframe); document.getElementById('file_upload_form').target = 'uploaderIframe'; //'uploaderIframe' is the name of the iframe addEvent($('uploaderIframe'),"load",showLoad); } var showLoad = function() { removeEvent($('uploaderIframe'),"load",showLoad); $('uploaderIframe').src="javascript:window.parent.document.getElementById('uploadInfo').innerHTML = document.body.innerHTML;"; } } Thanks, Jon W Greetings, I am currently using the websites tutorial about browser detection using the navigator. http://www.javascriptkit.com/javatutors/navigator.shtml I am however finding myself unable to detect a pattern in order to learn from. My aim is to use Browser detection to have a CSS file for each browser type, such as Firefox, IE, Opera, Safari and then an overall CSS file if none of the above, to fix numerous flaws. For IE and Firefox using the site's code is all well and good and while I haven't tested it yet I'm wondering how to set up the coding so that it can detect a safari browser. There are lots of slashes and d's and brackets and I do find myself unable to understand their purpose. So if someone can explain how I could do it for Safari I would be very appreciative. Hello, I have a question what is the best way to identify a browser, browser version and OS in javascript. I have try a few scripts but they all fail. This will help me out formating the code for diferent browsers. Thanks I have some java script in my vb.net application and I've been trying to figure out why my web app keeps crashing when i try to instantiate an array (i placed a comment where the app is crashing in the code below). Here's my code... Code: function CopyItem(plyrDuplicate,copyPlyrPostback) { var plyrDuplicate = (typeof plyrDuplicate == "undefined")?'defaultValue':plyrDuplicate; var firstListBox = document.getElementById('<%= lstPlayerSelect.ClientID %>'); var secondListBox = document.getElementById('<%= lstPlayerQueue.ClientID %>'); var postBack = -1; if (copyPlyrPostback == 0){ postBack = 0; } //alert("in the function"); //alert(postBack); if (postBack == -1) { for (var i = 0; i < firstListBox.options.length; i++) { if (firstListBox.options[i].selected) { var newOption = document.createElement("option"); newOption.text = firstListBox.options[i].text; newOption.value = firstListBox.options[i].value; playerVal = newOption.value; CheckDuplicate(playerVal); var printRec = CheckDuplicate(playerVal); alert(playerVal); alert(CheckDuplicate(playerVal)); if (printRec != true) { //alert(secondListBox.options[secondListBox.options.length]); //alert(secondListBox.options.length); secondListBox.options[secondListBox.options.length] = newOption; } } } if (document.getElementById('ErrorMsg').style.display = 'inherit') { document.getElementById('ErrorMsg').style.display = 'none'; } } else { alert("inside other else block, hurray~!!!"); hdnSessionVariable = '<%=Session("playerId")%>'; hdnSessionVariable = hdnSessionVariable.split(","); for (var ii = 0; ii < hdnSessionVariable.length; ii++) { for (var i = 0; i < firstListBox.options.length; i++) { if (hdnSessionVariable[ii] == firstListBox.options[i].value) { //alert("we have a match!!!"); var newOption = document.createElement("option"); newOption.text = firstListBox.options[i].text; newOption.value = firstListBox.options[i].value; playerVal = newOption.value; CheckDuplicate(playerVal); var printRec = CheckDuplicate(playerVal); alert(playerVal); alert(CheckDuplicate(playerVal)); alert(newOption.value); if (printRec != true) { secondListBox.options[secondListBox.options.length] = newOption; //app crashes on this line } } } } Updatelist(); return false; } Hopefully the code above is enough for to figure out the issue. However, here's a mini recap of what's going on. A user selected a value from firstListBox and the function above copies it over to secondListBox. The code in the first condition works fine, but the code in the else block doesn't. Now, here's the catch/difference between the if and else statement...the Else block is basically doing the same thing as the if statement, except the values that needs to be copied are coming from a session variable (hdnSessionVariable = '<%=Session("playerId")%>'. I've commented out every line in the else statement and the app works until it hits the secondListBox.options[secondListBox.options.length] = newOption line. Anybody have any idea what's wrong here? Hello, I have a website that I need help with. You can visit it he http://www.shahspace.com/bow/home.html. To see what I need help with, click on the services menu item and observe the alert message that comes up. It should say "point 1". Here is the code that executes that: Code: function enableScrolling(menuName) { alert("point 1"); var menu = document.getElemenetById(menuName); alert("point 2"); ... } As you can see, there should be a second alert message that says "point 2", but there isn't. The script is crash when I try to assign to menu the object returned by document.getElementById(menuName). I have verified that menuName is correct. So why would this be crashing? To get a fuller understanding of my algorithm, I'll give you the following: The menu div: Code: <div id="services_menu" class="services_menu"> ... </div> The "services" button: Code: <td><a href="#" onclick="displayMenu('services'); return false;"><img src="services.jpg" border=0></a></td> The displayMenu() function: Code: function displayMenu(menu) { var menuName = menu + "_menu"; document.getElementById(menuName).style.display = "block"; if (itemCount(menuName) >= 12) { enableScrolling(menuName); } else { disableScrolling(menuName); } } The itemCount() function: Code: function itemCount(menuName) { var menu = document.getElementById(menuName); var divArray = menu.getElementsByTagName("div"); return divArray.length; } And the enableScrolling() function I already posted above. So essentially, when the user clicks on "service", the services menu becomes visible. If the menu contains 12 items or more, scrolling needs to be enabled. This entails setting the menu to a fixed height and allowing the user to scroll through it (scrolling, in this case, will be customized--I'm not using the div's native scrolling feature). The really odd thing is that in itemCount(), I have exactly the same line: var menu = document.getElementById(menuName); and it works fine there. Why not in my enableScrolling() function? Hello! I am trying to find a script that allows you to open multiple browser tabs and then close each of those tabs, either one by one or all at once. Does anyone know how to do this please? Thanks so much for your help. I have code that I've been using for awhile now that will automatically log users off my site after a period of time. It works great using a 32 bit browser but not at all with a 64 bit browser. For the life of me I can't figure this out. <script type='text/javascript'> var secondsRemaining = 30; var mhcTimer; function countDown() { secondsRemaining -= 1; if (secondsRemaining <= 0) { secondsRemaining = 0; window.location='login.aspx'; } } function startAutoLogoff() { if (mhcTimer) { return false; } else { mhcTimer = setInterval('countDown();', 1000); } } startAutoLogoff(); </script> I'm trying to use SmoothGallery 2.1 on my website as a featured box. I tried opening the demos provided with the code in all browsers to make sure it was compatible and it showed fine in them all. I copied the javascript onto my site and I'm able to show the gallery. However in Chrome and Internet Explorer it shows fine, but Firefox the images are spread vertically down my site and the javascript gallery box doesn't show. I don't understand why this is an issue because it shows fine opening the demo pages and the javascript code and css is a straight copy from the folder :S Can anyone help me out? Website I'm having the issue on is www.deewon.com -Thanks Dear all, can somebody help me with browser compatibility and this code. Working fine in Opera and Firefox, but do not working in Internet Explorer and Chrome. With one form working fine in every browser, but when I put second form it stops to work in Explorer and Chrome. Code: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <HTML> <HEAD> <META http-equiv=Content-Type content="text/html; charset=UTF-8"> <SCRIPT type="text/javascript"> function showDiv(divIndex) { var f=document.forms[0]; var d=f.getElementsByTagName('div'); for(i=0;i<d.length;i++)d[i].style.display='none' d[divIndex].style.display = 'block'; } </SCRIPT> </HEAD> <BODY> <form> <select onchange="showDiv(this.value); "> <option value="0" selected>option 1</option> <option value="1">option 2</option> <option value="2">option 3</option> </select> <div style="display:block;"><form action="001.htm" method="get" > Your state<br> <select name="statecode" id="statecode"> <option value="">Choose State for option 1...</option> <option value="AK">Alaska</option> <option value="AL">Alabama</option> <option value="AR">Arkansas</option> </select> <input type="submit" name="search" value="Get Quotes" /> </form></div> <div style="display:none;"><form action="002.htm" method="get" > Your state<br> <select name="statecode" id="statecode"> <option value="">Choose State for option 2...</option> <option value="AK">California</option> <option value="AL">Colorado</option> <option value="AR">Connecticut</option> </select> <input type="submit" name="search" value="Get Quotes" /> </form></div> <div style="display:none;"><form action="003.htm" method="get" > Your state<br> <select name="statecode" id="statecode"> <option value="">Choose State for option 3...</option> <option value="AK">Massachusetts</option> <option value="AL">Maryland</option> <option value="AR">Maine</option> </select> <input type="submit" name="search" value="Get Quotes" /> </form></div> </form> </BODY></HTML> I was wondering if there was any way to determine what browser the remote address is using through JavaScript preferably or any other language and if so how to direct them to another page if they're using a specific browser...
I am in the process of developing a form for the company intranet and i've recently added in code to capture the enter key event to prevent the page from automatically submitting. Along with this, i added code to move the focus to the next element in the tab index. When used in IE, the code works perfectly, but when i use it in firefox or chrome the focus jumps to the same box every time. I don't know what i'm doing wrong am i'm hoping someone can help me figure this out. You can test the page at http://implicitarts.com/fandfwork/Lo...l/default.aspx To start, go to the box for duty amount or freight charges and press enter The following code is what I used to handle this event. Code: function handleKeyPress2(e,control) { var evt = e ? e : window.event; var bt = control.id; if (bt) { if (evt.keyCode == 13) { //bt.click(); jumptoNext(control, e); stopEvent(e); return false; } } } function jumptoNext(field, event) { for (i = 0; i < field.form.elements.length; i++) if (field.form.elements[i].tabIndex == field.tabIndex + 1) { field.form.elements[i].focus(); if (field.form.elements[i].type == "text") field.form.elements[i].select(); break; } } function stopEvent(e) { if (e.stopPropagation) e.stopPropagation(); else e.cancelBubble = true; if (e.preventDefault) e.preventDefault(); else e.returnValue = false; } Hi to everyone! Script first: Code: var allowscroll = 0 //Mouse scroll ____________________________________________________________________________________ function handle(delta) { if(allowscroll == 1){ if (delta < 0){ simgs1dest_x -= 30 } else{ simgs1dest_x += 30 } } if(allowscroll == 2){ if (delta < 0){ textdest_y -= 30 } else{ textdest_y += 30 } } } function wheel(event){ var delta = 0; if (!event) event = window.event; if (event.wheelDelta) { delta = event.wheelDelta/120; } else if (event.detail) { delta = -event.detail/3; } if (delta) handle(delta); if (event.preventDefault) event.preventDefault(); event.returnValue = false; } if (window.addEventListener){ window.addEventListener('DOMMouseScroll', wheel, false); window.onmousewheel = document.onmousewheel = wheel; } I'm using this script to scroll two divs, which each activates self scrolling onMouseOver and onMouseOut deactivate scrolling by setting allowscroll varible to 0. And everything works fine, but this script doesn't allow to scroll browser entire page! So is there a script wich will scroll browser page when allowscroll is equal to 0? ok, so i am working on a type of Option Box that is heavily formatted with CSS and animated using JS $fx() The $fx framework works fine on all browsers, and i have only used fairly simple code, and yet my page functions perfectly on Chrome and Safari. but will not work in Firefox or IE (Firefox does nothing, and IE has a couple of css issues and doesnt work either...) http://calumk.com/else/blogpoststuff...ng_Option_Box/ if anyone could help me i would really appreciate it. (obviously view in Chrome or safari to see how it is meant to respond) Hello All, I'm working on a image slider, which will slide left to right and vice versa on mouser over event. the images are dynamically loaded from the database using ASP script. I use mootools.svn.js for the sliding implementation. and Ajax to pass the id of the image to another page as a query string. this is implemented in a Code: onclick="getValue('<%= id %>')" event. This works fine in IE8, but when I test in Firefox 3.6 and Chrome the onclick event doesn't work. when I comment the mootools.svn.js, the onclick event get fired. what causes this. is their any solution? now my development has come to a grinding halt because of this. Please help <%@ Import Namespace="System" %> <%@ Import Namespace="System.Data" %> <%@ Import Namespace="System.Data.SqlClient"%> <%@ Import Namespace="System.Configuration" %> <%@ Import Namespace="System.Collections" %> <%@ Import Namespace="System.Web" %> <%@ Import Namespace="System.Web.Security" %> <%@ Import Namespace="System.Web.UI" %> <%@ Import Namespace="System.Web.UI.WebControls" %> <%@ Import Namespace="System.Web.UI.WebControls.WebParts" %> <%@ Import Namespace="System.Web.UI.HtmlControls" %> <%@ Import Namespace="System.Text" %> <%@ Page Language="C#" AutoEventWireup="true" CodeFile="slider.aspx.cs" Inherits="slider" %> <!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 runat="server"> <title>Untitled Page</title> <script language="javascript" type="text/javascript"> //GETS THE IMAGE ID FROM function getValue(val) { alert(val); showHint(val); //document.form1.newval1.value=val; } var xmlhttp=null; //xmlhttp variable //Ajax function make_httpRequest(){ if (window.XMLHttpRequest) { // code for IE7+, Firefox, Chrome, Opera, Safari xmlhttp=new XMLHttpRequest(); } else if (window.ActiveXObject) { // code for IE6, IE5 xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); } else { alert("Your browser does not support XMLHTTP!"); return; } } //Bind the query string as a URL function request_url(url){ url=url+"&sid="+Math.random(); xmlhttp.open("GET",url,false); xmlhttp.send(null); } //BIND THE IMAGE ID TO THE QUERY STRING VARIABLE TO THE url variable function showHint(val) { make_httpRequest(); var url = "Test.aspx?prodid="+ val; request_url(url); } </script> <style type="text/css"> <!-- .slider_con { height: 125px; width: 889px; } .slider_content { height: 125px; width: 889px; float: left; overflow: hidden; position:relative; } .image_con { float: left; height: 125px; width: 23px; } #maiin_container{ width: 889px; height: 125px; overflow: auto; overflow-x:hidden; overflow-y:hidden; float:left; } .main-content { width: 889%; height: 125px; } .section{ margin:0 0 0 0; float:left; } --> </style> <style type="text/css"> <!-- a { font-family: sans-serif; font-size: 15px; color: #666767; } a:link { text-decoration: none; } a:visited { text-decoration: none; color: #666767; } a:hover { text-decoration: none; color: #666767; } a:active { text-decoration: none; color: #666767; } .style1 { color: #A0A0A0 } --> </style> </head> <script type="text/javascript" src="mootools.svn.js"></script> <script type="text/javascript"> window.addEvent('domready', function(){ var scroll2 = new Scroller('maiin_container', {area: 100, velocity: .12}); // container $('maiin_container').addEvent('mouseover', scroll2.start.bind(scroll2)); $('maiin_container').addEvent('mouseout', scroll2.stop.bind(scroll2)); }); </script> <body> <form id="form1" runat="server"> <div class="slider_con"> <div class="image_con section"> </div> <div id="maiin_container"> <div class="main-content" id="Div1"> <% string connectionString = @"Data Source=174.37.88.148;Initial Catalog=lalith_db;uid=lalitha_jew;pwd=lalitha1234"; string query = "SELECT prod_id, prod_itemcode, prod_title, prod_thumbnailimage FROM dbo.products WHERE cat_id="+22+"and prod_topfive = 'yes' UNION SELECT prod_id, prod_itemcode, prod_title, prod_thumbnailimage FROM dbo.products WHERE cat_id="+22+"and prod_topfive = 'no'"; SqlConnection conn = new SqlConnection(connectionString); try { conn.Open(); } catch(Exception ex) { conn.Close(); } SqlDataReader reader; using (reader = new SqlCommand(query, conn).ExecuteReader()) { if (reader.HasRows) { while (reader.Read()) { int id = reader.GetInt32(reader.GetOrdinal("prod_id")); string prod_itemcode = reader.GetString(reader.GetOrdinal("prod_itemcode")); string prod_title = reader.GetString(reader.GetOrdinal("prod_title")); string prod_thumbnailimage = reader.GetString(reader.GetOrdinal("prod_thumbnailimage")); int i = prod_thumbnailimage.IndexOf('b'); string url = prod_thumbnailimage.Substring(i); %> <div class="section"> <a href="#" id='<%= id %>' onclick='getValue(<%= id %>)'><img id="img" src='<%= url %>' alt='<%= prod_title %>' /></a> </div> <% } } } %> </div> </div> </div> </form> </body> </html> I have found this Alarm Clock from JavaScript Kit and when the alarm time is reached it redirects to the URL entered. I would like to keep the alarm clock running, have it open a new window for the entered URL such as (Target="Blank") in HTML. Can someone help? var jsalarm={ padfield:function(f){ return (f<10)? "0"+f : f }, showcurrenttime:function(){ var dateobj=new Date() var ct=this.padfield(dateobj.getHours())+":"+this.padfield(dateobj.getMinutes())+":"+this.padfield(dateo bj.getSeconds()) this.ctref.innerHTML=ct this.ctref.setAttribute("title", ct) if (typeof this.hourwake!="undefined"){ //if alarm is set if (this.ctref.title==(this.hourwake+":"+this.minutewake+":"+this.secondwake)){ window.location=document.getElementById("musicloc").value } Does anyone have any idea how to imitate browser zoom with javascript? I know you are not allowed to control browser's zoom capabilities, but perhaps there's a way to change all content dimensions with javascript? In firefox, when you press ctrl+, the whole page resizes appropriately, even background images. With this imitation JS zoom, background images would not zoom since there is no scale size numer or anything like that in CSS. It would simply be cool to have a script that resizes everything on the page. That way, you can design highdefinition content that fits a 1280 * 960 browser frame, but can zoom out for smaller resolutions (1024 or 800). That's be neato!! Any ideas? Anyone know a script? Hi, I'm doing something wrong, I want my script to execute when the browser window opens, can someone please help me? Code: <p><iframe id="myFrame" style="display: none;" width="500" height="300"></iframe> <script type="text/javascript">// <![CDATA[ window.onload=openpdf(); type="text/javascript">// <![CDATA[ function openPdf() { var omyFrame = document.getElementById("myFrame"); omyFrame.style.display="block"; omyFrame.src = "myFile.pdf"; } // ]]></script> Hi, I have a requirement where, on a link, when the user clicks, the app should copy all browser favorites and write to a db (table that has two columns, one with fav name and one col for the website link). Thoughts on how to get this done ? How can I read the the browser favorites from a javascript ? Thanks, Deepna Dear All, I have downloaded some code from a javascript programmers website but having trouble making it work! I have some javascript: [CODE] <SCRIPT TYPE="text/javascript"> <!-- function dropdown(mySel) { var myWin, myVal; myVal = mySel.options[mySel.selectedIndex].value; if(myVal) { if(mySel.form.target)myWin = parent[mySel.form.target]; else myWin = window; if (! myWin) return true; myWin.location = myVal; } return false; } //--> </SCRIPT> [CODE] Within the main body, my code reads: [CODE] <FORM ACTION="../cgi-bin/redirect.pl" METHOD=POST onSubmit="return dropdown(this.gourl)"> <SELECT NAME="gourl"> <OPTION VALUE="">Please select your event... <OPTION VALUE="http://www.yahoo.co.uk"> preview yahoo UK</option> <OPTION VALUE="http://www.yahoo.com"> preview yahoo US</option> <OPTION VALUE="http://www.yahoo.fr"> preview yahoo FR</option> <OPTION VALUE="http://www.expedia.co.uk"> preview Expedia</option> <OPTION VALUE="http://www.travelocity.co.uk"> preview Travelocity</option> <OPTION VALUE="http://www.onlinepictureproof.com"> preview online pics</option> </SELECT> <INPUT TYPE=SUBMIT VALUE="Go"> </FORM> [CODE] On selection of "preview yahoo UK" from drop-down box, it takes me to the correct webpage (www.yahoo.co.uk), so no issue there. However, it opens this page up in a new window. I'm pretty sure this is because the javascript code is telling it to. However, I want the www.yahoo.co.uk page to be displayed in the same window from where the request came from? (i.e. I don't want it to open a new browser window)! What do I have to change in the javascript to make this happen? I tried using the TARGET functionality taught to me many many moons ago, but it still fires up a new window: <OPTION VALUE="http://www.yahoo.co.uk" TARGET="_top"> preview yahoo UK</option> I am testing this on my PC, so perhaps it could be that redirect.pl isn't held locally on my home pc, i.e. it would work once we upload the web pages to the web server?! any help/guidance would be greatly appreciated. |