JavaScript - Using Settimeout Causing Firefox Page Loading Animation
HI,what is wrong here?
I am trying to write code to print a message 5 seconds after document has loaded. Code: <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <script> var i; function printMsg(){ document.write("delayed string"); //tried adding to this line: clearTimeout(i); } function timedfunc(){ i=setTimeout(printMsg,5000); } </script> </head> <body onload="timedfunc()"> </body> </html> The message appears ok but the page loading bar in the browser + hourglass wont go away (in firefox). Similar TutorialsSo, I have to rely on a third party external JS file to load into a site of mine. Problem is I have to have it (for ads), but once every blue moon the server fails to repond to the request (its down or unresponsive), and thus because the JS can't load, the site hangs. Is there a reliable js/ajax etc.. mechanism that I can use to set an allotted time and if the js isn't loaded, cancel the call or stop it so the page can load? Please advise. Caveats: I cannot host it, I cannot use php. Basically I was given a script call and I include it in the header of the page. I don't have alot of room to host, use various technologies etc.. other than what I am able to use without any backend/app scripting. been a while since i been to the experts for help figures i was about due for an issue beyond my solving capabilities ok so the code The function containing the rogue setTimeout Code: function refresh_timer(){ //alert(window.timer); var total = getTotal(); document.getElementById('status').innerHTML = 'Updating in '+ (total-(window.timer+1))+' seconds.'; if((total-window.timer) == 0){ refresh_feed(); } else{ //setTimeout("refresh_timer()",1000); setTimeout(function(){ alert("");},1000); window.timer++; //alert("1"); //alert(window.timer); } } everything in the above function works except the setTimeout itself the script doesn't break and i get no errors in the firebug initially window.timer is set to 0 and everytime refresh_feed() executes window.timer gets reset to 0 refresh_timer() gets called up by the return from an ajax call(again works in chrome and ie8) any help is appreciated hello, The following code is causing firefox to crash: Code: if (!e) { alert("!e"); e = window.event; } alert("before"); var x = e.pageX; alert("after"); By 'crash', I mean it just stops running. It doesn't give me an error message or shut down the browser, it just quits reading the script. I get the alert box "!e" and "before" but I don't get anything for "after". At the line var x = e.pageX; it seems to die. This seems to happen anytime I use e, for example e.clientX, e.screenX, e.type, etc. This doesn't occur in IE. Anyone know what the problem is? Hello all, I have the following code to load a new html page into the 'new content' div once the user scrolls to the bottom of the page. It all works fine. No problems, except I would like it to pause for a moment whilst it is loading, and show a loading box div at the bottom of the screen as it loads the new content, just to give some positive feedback for the user. So the new div would sit in a fixed position at 'bottom:0px;' and have a loading image inside it. Is this easy to do? I am new to javascript so bear with me Code: alreadyloading = false; nextpage = 2; $(window).scroll(function() { if($(window).scrollTop() + $(window).height() == $(document).height()) { if (alreadyloading == false) { var url = "page"+nextpage+".html"; alreadyloading = true; $.post(url, function(data) { $('#newcontent').children().last().after(data); alreadyloading = false; nextpage++; }); } } }); The 'new content' is a div which is at the bottom of the page and is where the new content loads to! Thank you very much Hi all, On my website I've got a simple animated .gif I want to play each time someone clicks a link on the menu bar. The problem is that while the image changes successfully, the webpage changes too quickly so the animated.gif won't play. I'm assuming this has something to do with setTimeout though I'm too much of a noob at Java to get this right. Here is one of the buttons: Code: <a href="facts.html" onmouseover='facts.src="images/thefactsbutton2.jpg"' onmouseout='facts.src="images/thefactsbutton.jpg"' onclick='top.src="images/chimneytopsm.jpg"'> <img name="facts" src="images/thefactsbutton.jpg" /> </a> Hello. My goal is to load the JS for a specific element before displaying that element. I integrated a third part script, and it works well. I set the timer he The JS is in my heading as <script type="text/javascript" src="countdownpro.js"></script> About mid-body I have: <span id="countdown1">2010-07-20 00:00:00 GMT+00:00</span> which allows for the setting of a target date to countdown to. When the page first loads it shows the above long format target time, until the js/meta tags kick in to modify it to just show the actual countdown as 00:00:00. I have attached countdownpro.js to this post. I tried shifting the function CD_Init() to the top of the script, and also appended it inline with the .html. I tried setting the big external script to "defer", but neither arrangement worked. I also tried placing the src file right at the top. I appreciate your help. I have an entirely javascript page that once it is done it still looks like it is loading. This is more of an annoyance than anything harmful. The page can be viewed at http://mikedombrowski.com/mRNA.html Thank you for your help in advance. Hi i have the following Code: <script type="text/javascript"> $(document).ready(function () { window.name = "main"; $("#uploadSubmit").bind("click", function () { //edit below to suit var src = "uploader.php"; //end var results = '<iframe src="' + src + '" name="uploader" id="uploaderIframe"></iframe>'; $("#uploader").append(results); $("#uploadResult").html('Uploading please wait... <img src="images/loader.gif" />'); $("#uploaderIframe").load(function () { var iframeHtml = $('#uploaderIframe').contents().find("body").html(); $("#uploadResult").html(iframeHtml); $("#uploaderIframe").remove(); main.execCommand('Stop'); main.stop(); }); }); }); </script> works perfectly but the main page keeps loading once the iframe is removed. Any know why and how i can terminate the loading? Basically, I have a total of three different JavaScripts that need to be loaded when the user opens the page; let's call them script_a.js, script_b.js, and script_c.js script_a.js and script_b.js each need to be loaded on every page; however, they do very different things (one displays text, the other creates buttons), and in the interest of readability and ease of editing later, I want to keep them separate. script_c.js only needs to be loaded on one page; there will be a few variants (script_c2, script_c3, etc), but again, each of them only needs to be loaded on a single page. The scripts are also too large and unwieldy for me to put them directly into the HTML (basically because I have to do a lot of different switches, and conditionals, and output formatting). At present, the only way I know how to load a JavaScript is to use window.onload, so obviously I'm getting into the issue of competing onLoads. Any help would be appreciated! Hello, I'm creating a section for a school website that will list over 9,000 book titles in four different categories (by Title, by Author, by Book Level, and by Points). The content is shown in a div and called and loaded via Ajax. Here is the test page: http://www.gilchrist.leon.k12.fl.us/ar/artest.htmlAfter you click "Go" when the drop down menu is displaying By Book Title, the content loads in the div in a few moments. Here is the content page that appears in the div after you click "Go": http://www.gilchrist.leon.k12.fl.us/...tByAuthor.html If possible, I need a "page loading..." script that will appear only after you click "Go" while the list of books is being loaded. I've been testing different ones I've found online, but can't get any to work. Of course, I'm not even sure if the script would be added to artest.html, 1112-QuistListByTitle.html, or a combination of both... Any help with this would be greatly appreciated. Thank you, Deborah Something is up with my coding, when I try to load the page.. it will only load in notepad. Help! <html> <head> <title>Other ways to help</title> <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; } function validateForm(form) { var fName = form.txtFname.value; var dataIsValid = true; var errMsg = "The following inputs are missing or invalid:\n\n"; if(fName == '') { errMsg = errMsg + "First Name\n"; dataIsValid = false; } if(lName == '') { errMsg = errMsg + "Last Name\n"; dataIsValid = false; } if(dataIsValid) { return true; } else { alert(errMsg); return false; } } //--> </SCRIPT> </head> <body> <a name="other"> <body background="otherbackground.jpg"> <center><table border="2" cellspacing="2" width="900" height="190" bordercolor="#000000"> <tr> <td width="60%" td bgcolor="white"> <b>To make a donation, fill and submit the following form. You can also make a cash donation directly by filling out your credit card information.<br/> Also, be sure to check yes if you would like to subscribe to our online monthly newsletter.</b><br/> <form name="Donations" method="post" action="#" onsubmit="validateForm(this);"> First Name<input type="text" name="txtFname" size="25" tabindex="1"> M.I.<input type="text" name="M.I." size="1"> Last Name<input type="text" name="Last Name" size="25"><br/> Street Address<input type="text" name="Street Address" size="25"> Street Address 2<input type="text" name="Street Address 2" size="25"><br/> City<input type="text" name="City" id="myCity" size="20"> State<input type="text" name="State" size="2"> Zip<input type="text" name="Zip Code" size="10"maxlength="9"><br/> Email<input type="text" name="Email" size="25"><br/> Credit Card Number<input type="text" name="Credit Card Number" size="10"maxlength="8"> Expiration Date<input type="text" name="Expiration Date" size="5"> Security Number<input type="text" name="Security Number" size="3"maxlength="3"> <textarea cols="50" rows="4" name="Comments">Comments or Questions:</textarea><br/> Subscribe to newsletter? <input type="radio" name="choices" value="Yes">Yes<input type="radio" name="choices" value="No">No<br/><br/> <input type="submit" value="Submit"> <input type="reset"> </form><br/> </table><br/> <FORM ACTION="../cgi-bin/redirect.pl" METHOD=POST onSubmit="return dropdown(this.gourl)"> <SELECT NAME="gourl"> <OPTION VALUE="">Choose a Destination... <OPTION VALUE="home.html">Home Page <OPTION VALUE="dogs.html">Learn About Dogs <OPTION VALUE="cats.html">Learn About Cats <OPTION VALUE="exotics.html">Learn About Exotics <OPTION VALUE="other.html">Other Ways To Help </SELECT> <INPUT TYPE=SUBMIT VALUE="Go"> </FORM> <br/><br?> </body> </html> Hi, nothing to serious, but definitely annoying. Every time i load my page, it loads to the halfway Y position down the page. I want to page to always load top every time it is refreshed or referenced to. You can see the problem here. Try and go to www.simeoncreative.com and click on any of the menu nav links. the page will load, but just halfway down the page. I tried both the Code: $(document).load().scrollTop(0); and Code: $(document).ready(function(){ $(this).scrollTop(0); }); JS codes in the linked .js file. How can I fix this? Thanks in advance for any help. So I have an HTML page with javascript that takes input values, computes some results, and then puts these results in a table. Works great. Now I realize some users might want to print just the results table. So I add a button that allows the user to request the table in a separate window; clicking the button invokes a script to re-create the table in a separate window. Works fine except: * In the status bar, the window appears to never finish loading * If you go to File -> Print then nothing seems to happen; however, if you close the generated window _then_ the print dialog appears; the window you want to print, however, is gone. Any suggestions? The code invoked by clicking the newly added button: [CODE] function grabResults() { var w = window.open("","ROIResults"+winCount++, "height=400,width=600,menubar=yes"); var d = w.document; d.write('<head>'); d.write('<link href="style.css" title="compact" rel="stylesheet" type="text/css" />'); d.write('<title>Return On Investment Calculations</title>'); d.write('</head>'); d.write('<body>'); d.write('<div id="logoholder">'); d.write(' <img src="TTFlogo2.gif" alt="Cannott display logo" "width="322" width="322" height="51"></p>'); d.write('</div>'); d.write('<div id="header">'); d.write(' <h2>Return on Investment Estimator for Classroom Training</h2>'); d.write('</div>'); d.write('<table rules="all" frame="box">'); d.write('<caption>Results - Estimated ROI</caption>'); d.write(' <tr><th>Course</th>'); d.write('<td class="center" id="courseName">'+cname+'</td>'); d.write(' </tr>'); d.write(' <tr><th>Duration (Days)</th>'); d.write('<td class="center" id="courseDur">'+cdays+'</td>'); d.write(' </tr>'); d.write(' <tr><th>Class Size</th>'); d.write('<td class="center" id="courseSize">'+csize+'</td>'); d.write(' </tr>'); d.write(' <tr><th>Location</th>'); d.write('<td class="center" id="courseLoc">'+teach_loc+'</td>'); d.write(' </tr>'); d.write(' <tr><th>Training Cost</th>'); d.write('<td class="justr" id="courseCost">'+TC+'</td>'); d.write(' </tr>'); d.write(' <tr><th>Initial Value</th>'); d.write('<td class="justr" id="courseInitial">'+startValue+'</td>'); d.write(' </tr>'); d.write(' <tr><th>Returned Value</th>'); d.write('<td class="justr" id="courseValue">'+RV+'</td>'); d.write(' </tr>'); d.write(' <tr><th>Increase in Value</th>'); d.write('<td class="justr" id="courseIncr">'+Inc+'</td>'); d.write(' </tr>'); d.write(' <tr><th>Net ROI after costs</th>'); d.write('<td class="justr" id="courseROI">'+ROI+'</td>'); d.write(' </tr>'); d.write(' <tr><th>ROI Rate</th>'); d.write('<td class="justr" id="courseROIRate">'+ROIR.toFixed(2)+'%</td>'); d.write('</tr> '); */ d.write('</table>'); d.write('<p class="in3">(All amounts are in US Dollars.)</p>'); d.write('</body>'); d.write('</html>'); d.close(); return true; } [ICODE] Hi, I'm writing a page scraper in javascript which involves loading a page to scrape, detecting when the page has loaded successfully and then scraping the data. I can get the 'page loading detection' to work if I load the page in a sub-frame. But this is no good as some sites include frame-buster code which breaks my scraper and I cant get any of the framebuster-buster solutions to work. So instead I decided to look at loading the page in a separate tab. Does anyone know how to reliably detect when a page has finished loading in a tab please? I am using Firefox only and I dont mind if the solution requires some extension or greasemonkey script (I have already added the configuration/commands to allow access to pages from different domains). The code below shows an attempt. It sometimes detects when the initial page has loaded but when I press 'submit' it doesnt detect the second loading. Thanks. Code: <html> <head> <script type="text/javascript"> currentPageObj = window.open("http://www.bbc.co.uk", "currentPage"); currentPageObj.addEventListener("load", function(){alert("loaded")}, false); </script> </head> <body> <form action="http://www.example.com" rel="nofollow" target="currentPage"> <input type="submit"> </form> </body> </html> I have been asking around other forums for this question....no one seems to be able to help. But reading through here you guys seem quite a bit smarter and I'm sure you can point me in the right direction What I need is a simple loading page that is for LOOKS only...the site I am redirecting to is very small and does not take very long to load...but for marketing purposes a loading page will make my business strategy look much more legit. I am linking to an affiliate page with a discount link. The problem is most people aren't actually sure if the discount link works...so I want to make a loading page where it says something like "Activating Discount". SO basically I have: My website>>>(link)>>>HTML Loading Page>>>(Redirects after 5 sec or so)>>>Afilliate Landing Page I'll put a loading wheel on the page like this one: But what I really want it to do is switch the messages its displaying so maybe it says "Loading Site Content" for 1 second then switches to "Activating Discount" for 1 second then switches again to "Validating Referrer" or something like that. THANK you so much for any help you can give me You guys rock! Here is the structure I am working with as this html/script was created by the chmProcessor to produce WebHelp files... index.htm contains: Code: <iframe id="mainFrame" name="mainFrame" class="full" src= "frameset.html"> frameset.html contains: Code: <frameset cols="20%,80%"> <frame id="treeFrame" src="tree.html" name="treeFrame" /> <frame id="frameCont" src="2_Welcome.htm" name="Welcome" /> </frameset> tree.html is the navigational panel and contains: Code: <script type="text/javascript" src="tree.js"> </script> I have placed alert() calls in tree.js. When I load index.htm in Chrome, apparently tree.js is not being loaded because I do not see any alert box and the functionality within tree.js does not work. Note: The functionality does work in IE and Firefox If I open tree.html directly in Chrome, the tree.js functionality does get called. I do not know how to solve this problem or why Chrome is not loading the pages and script correctly. Thanks for your help! Ok, I am aware this will sound like a plug for my script, but please bare with me. I created a bookmarklet script to help me audit extremely large style sheets. Basically while on a site that you would like to audit, you click the bookmarklet and the document's body contents gets remove and replaced with an iframe that points to the current sites home page. From here you can choose what style sheet (the script finds) to begin reporting over. The more pages you browse (through the iframe) the more accurate the report gets. My problem however, is if the person is on the site's home page when first running the script, the iframe never loads up. I think it has to do with the fact that you are on the home page, and then the iframe tries to point to the home page as well and fails for some reason. Is there any solution that comes to mind for anyone out there? You can test it by bookmarking this bookmarklet and running it on any site's home page where style sheets can be found: Get The Bookmarklet on this page Again, it works great if you don't start the script from a sites home page. I'm no coder, as you will soon discover. The web work I do is from a purely novice, even hobby standpoint and the sites I create and host are nothing more than favors for friends and acquaintances who have needed but have not had a presence on the web. This being explained, I am asking those with coding skills to please take a look at the site I've just completed for a little diner down the road. (They're just starting out and can't afford to pay a professional web designer and, unfortunately, are stuck with me.) The site is http://d-n-ddiner.com I'm the first to say that the mouseover sound would drive me crazy, but the guys who own the diner are enthusiastic and want it left as is. I have had to combine scripts in order to have the "black-and-white to color" image effect work simultaneously with sound. The sound script depends on uploaded files: soundmanager.js, soundcontroller.swf and sound-config.xml and its tags are found incorporated with each involved image, within the body. The image effects are just the result of playing around with bits and pieces I've seen, mucking about the Internet. Its script is found within the head and also within the body, in each involved image's area, in mouseover, mouseout and, of course when specifying "name=" (such as Img_1). I opted for providing the sound in this manner because I am able to use an .mp3 file, rather than having to weigh through the pros and cons of .au versus .wav, etc., and the fickle nature of different browsers and plug-in crashes. After having many test the site (friends with varying operating systems and browsers) it appears that this mp3 solution makes the mouseover sound available to a broader range of users. Success has been achieved with Firefox, Safari, Netscape, Omniweb and Chrome. However, Internet Explorer and Opera seem to be the holdouts for both Mac and PC users. All this brings me to two requests: Would someone take a look at the site (particularly with Firefox) to determine if something might be done to help the page load more smoothly? Secondly, is there some sleight-of-hand that might be incorporated into the script to help IE and Opera detect the mouseover sound or do you consider these two browsers essentially not worth the bother? I am attaching a zip of the sound files I mentioned. The mp3 is not included but any mp3 snippet would do for testing, provided the sound config file is edited to reflect its file name. My primary concern is smooth page-loading; the IE and Opera issue is of less importance. Thank you for your patience and for any assistance you would offer. i need a javascript that will show LOADING in the top left or top right corner of the page until the entire page is completely loaded because the page is VERY VERY VERY long.... and it takes a while on 56kbps because it has so much text.... like in Google's GMAIL, it has the red and white Loading text in the top right until the page loads... can someone refer me to such a script?
Okay, for some reason the setTimeout isn't working for me, and I have no idea why. I've tried everything and Googled even more. If anyone has any ideas, I'll be grateful Code: function display(min,sec) { if (sec <= 0) { sec=60; min-=1; } if (min <= -1) { sec=0; min=0; tEnd(); } else { sec = sec-1; } if (sec<=9) { sec = "0" +sec; } document.form.time.value=min+":"+sec; SM = window.setTimeout("display("+min+","+sec+")",1000); } function tEnd() { window.clearTimeout(SM); alert('Your time is up!'); } Thanks in advance. |