JavaScript - Replacing An Empty/null Image
Hey folks. I currently have a PTZ camera that is taking screenshots every minute (or so) and sending a copy of that image (overwriting the previous one) to my website. Basically, the visitors to the website will be greeted with a live screenshot. The problem is if the visitor hits the website at just the right time, the screenshot won't be loaded completely while the 2nd most screenshot is being overwritten... creating an empty image load (the dreaded red X). What I am looking to do with Javascript is to be able to load a generic image in the scenario in which no image loads. Is that possible?
I tried doing something like the following and onload-ing it, but it wouldn't work. Any help would be appreciated. Thanks! Code: <script type="text/javascript"> <!-- function replaceSrc() { var images = document.getElementsByTagName('img'); for(var i = 0; i < images.length; i++) { var img = images[i]; if(img.src.length == 0) { img.src = 'images/garbage.gif'; } } } --> </script> Similar Tutorialshi! i know little about programming, or javascript... ...i've set up several lightwindows on a site... ...fine in all browsers except IE (8 for sure, maybe others too...) ...the lightwindows load normally the first time they are clicked, but if they are closed and opened again, on the 2nd or subsequent times the window opens up at the bottom and an extra 'secret panel' (!) appears... ...in it it says, 'Null' on the left hand side, and 'by null', almost like a signature, on the right! The IE error message assoc. with this is: Message: 'null' is null or not an object Line: 5 Char: 5280 Code: 0 URI: http://www.kabeoke.com/swfobject.js And the FF error console (even though it works fine in FF...) says this: Error: $("lightwindow_image_" + i) is null Source File: http://www.p51labs.com/lightwindow/c...ipt.js,html.js Line: 5595 So the error is really specific to IE, and seems to involve javascript... ...can anyone help? Many Thanks Hi I am having trouble with a script. I cannot figure out why I get the message: error: null is null or not an object (In IE8) The site is: www.rayburns.com I have check the javascript for the navigation bar and for the rotating images and cannot see what is missing. Not sure what is not being called. Can someone please help with this. Thank you in advance! Hi i have done some reading on the net today because i am getting an error on ie. I did find the javascript twice in my code, once in the header and once here, so i removed it from the header. I also changed to src to the full url. But i am still getting this and i dont know why. the file is located in the root directory. Code: Webpage error details User Agent: Mozilla/4.0 (compatible; MSIE 8.0; Windows NT 5.1; Trident/4.0; SearchToolbar 1.2; .NET CLR 1.1.4322; .NET CLR 2.0.50727; .NET CLR 3.0.4506.2152; .NET CLR 3.5.30729; msn OptimizedIE8;ENUS) Timestamp: Sat, 30 Jul 2011 16:03:05 UTC Message: 'null' is null or not an object Line: 8 Char: 3894 Code: 0 URI: http://www.mysite.com/swfobject.js Code: <script type='text/javascript' src='$CONST_LINK_ROOT/swfobject.js'></script> <script type='text/javascript'> var s1 = new SWFObject('player.swf','player','400','300','9'); s1.addParam('allowfullscreen','true'); s1.addParam('allowscriptaccess','always'); s1.addParam('flashvars','file=$CONST_LINK_ROOT/movies/$sql_array->vid_id.flv'); s1.write('preview'); </script> <embed src='$CONST_LINK_ROOT/flvplayer.swf?file=$CONST_LINK_ROOT/movies/$sql_array->vid_id.flv&autoStart=false' width='175' height='175' quality='high' type='application/x-shockwave-flash' pluginspage='http://www.macromedia.com/go/getflashplayer'></embed> would appreciate any suggestions thanks. i was on 1.5 swfobject i did download 2.2 and im guessing all you do is replace the swfobject.js file to upgrade it, but what happened is it gives me this now. Code: Webpage error details User Agent: Mozilla/4.0 (compatible; MSIE 8.0; Windows NT 5.1; Trident/4.0; SearchToolbar 1.2; .NET CLR 1.1.4322; .NET CLR 2.0.50727; .NET CLR 3.0.4506.2152; .NET CLR 3.5.30729; msn OptimizedIE8;ENUS) Timestamp: Sat, 30 Jul 2011 16:31:08 UTC Message: 'SWFObject' is undefined Line: 1283 Char: 1 Code: 0 URI: http://www.mysite/video_admin.php?type=v i dont mind going back to the old version i just need to get this working and im soooooooo lost lol ok another update, this is becomming maddening lol. once i have this line in the header php Code: <script type='text/javascript' src='$CONST_LINK_ROOT/swfobject.js'></script> I never have to use it again as long as they header php is included correct? This is what is driving me nuts, im back on 1.5 and it says its undefined Code: but am in not defining it on this line? ---> var s1 = new SWFObject('player.swf','player','400','300','9'); <script type='text/javascript' src='swfobject.js'></script> <script type='text/javascript'> var s1 = new SWFObject('player.swf','player','400','300','9'); s1.addParam('allowfullscreen','true'); s1.addParam('allowscriptaccess','always'); s1.addParam('flashvars','file=$CONST_LINK_ROOT/movies/$sql_array->vid_id.flv'); s1.write('preview'); </script> Another Update. I am back to the original question. null is null or not an object.. in my search i have found this found a solution. basically Internet Explorer is crappy and doesnt like the setAttribute property so had to change the onchange handler by directly changing the attrbute for the object like so. object.onchange = function() {} i have no idea what they means, does that mean i need to change swfobject.js or does that mean i have to change my xml request. and if it is the swfobject i have no clue what they mean or what lines Hi I've implemented Busybox on a website to display FLV files in a popup player. This works fine, except for the following error in IE (FF is fine) when I close the popup: 'null' is null or not an object I think I've narrowed it down to the following block of code, but am stuck as to what to do from here. Code: var cl = new Element('img',{ 'styles':{ width:'24px', height:'24px', position:'absolute', top:'-20px', right:'-20px', 'z-index':'100000' }, 'src':'bumpbox/closed.png', 'id':'closer' }) cl.addEvent('click',function(e){ e = new Event(e).stop(); bg.dispose(); $(el).getChildren().dispose(); eff2.start({ 'width':[maxw,1], 'height':[maxh,1], 'left': [endleft,middleH], 'top': [endtop, middleV+s] }) }) The IE error is just giving me line number 1 of the php, but the error, I'm sure, lays in the Javascript. Many thanks Is it possible, when a page is reloaded, to replace a link to a javascript in the head with a link to a different script?
hi, I am curious about the use of appendChild() here... I have a solution that does what I want it to do, like this: Code: var sidebarEntry = createSidebarEntry(poly, html); sidebar.appendChild(sidebarEntry); sidebar.replaceChild((sidebarEntry),sidebar.firstChild); but it seems to be going the long way around. Not that it matters much (I guess), but all I want to do is to add an item to the sidebar and when a new item is added, remove the existing one. I tried just using relaceChild() on its own, but the code seems to need something to be replace... Is the above the best way to do it? Or is it possible to set the child to some dummy position like null to begin with, so that the code is not constantly reloading and replacing items (which is what I understand is going on now)? here's the page I'm working on, if you want to see the rest of the code. I appreciate any thoughts. Hi, I know how to replace all the + signs in a url string by spaces, like this: newstring=oldstring.replace(/[+]/g," "); but how do I replace a substring by a comma easily? This doesn't do it: newstring=oldstring.replace(/[&menuitems]/,","); Thanks in advance for any help. Hi, I am quite new to JS and is currently building a website with a little of JS Function. Ok, so I have a Page tat consists of 10 images. Each images when on mouse over, will display a larger version on the images, using JS(onmouseover). Then, I will have a next button that will replace all the images, using Ajax, which means my page will not be reloaded. The problem comes here when I have to replace all the onmouseover effect. I can replace all the thumbnails without problem, but the onmouseover I have problem replacing. Is there anyway that I can dynamically replace all the onmouseover? Any help will be appreciated. Thanks I have the following code that works fine: Code 1 Code: <script type="text/javascript"> AJS.AEV(window, 'load', function() { GB_show("Special Presentation", "http://www.site.net/temp/images/ads/special.jpg", 352, 600); }); </script> I also have the following code that works fine: Code 2 Code: function DoTheCookieStuff() { visited=getCookie('visited'); if (visited==null) { setCookie('visited','yes',365) MyWindow=window.open('http://www.site.com','MyWindow','toolbar=yes,location=yes,directories=no,status=yes,menubar=yes,scrollbars=yes,resizable=yes,width=640,height=480,left=1,top=1'); } } However, I want to replace the blue code in the Code 2 immediately above that opens the window with the red code in the Code 1 section that opens the GreyBox window. I tried the following but it's just not working: Code: function DoTheCookieStuff() { visited=getCookie('visited'); if (visited==null) { setCookie('visited','yes',365) AJS.AEV(window, 'load', function() { GB_show("Special Presentation", "http://www.site.net/temp/images/ads/special.jpg", 352, 600); }); } } Thank you. I'm sorry this is simple, but: Code: function printInput(f){ var ifr = window.frames['printFrame']; var v1=readCookie('lesson'); if (v1==1){v2='WORKNOTEPAD1'} if (v1==2){v2='WORKNOTEPAD2'} if (ifr){ ifr.document.getElementById('content').innerHTML=f. v2 .value.replace(/\n/g,'<br />'); ifr.focus(); ifr.print(); } else { something } } In this line: Code: ifr.document.getElementById('content').innerHTML=f. v2 .value.replace(/\n/g,'<br />'); How can I make it stop erroring and act as if the "v2" were, say, "WORKNOTEPAD2"? If the line contains the string it all works fine. It must be so simple... Hey guys... Basically I need a function that will remove numerous elements from a page based on their class. I then also need a function to bring those elements back afterwards. If anyone is wondering, I'm trying to add buttons to remove/add images. Thanks! Hi Guys/Gals I am trying to do a small website for our family to keep track of each other's home address and etc.. using asp for the codes .. (its been ages since i indulge myself) i have 2 forms in which in FormA, i will key in the following address 666, ST Avenue #03-09 Anchor View Residence 123456 when i click on submit it shows this on FormB 666, ST Avenue #03-09 Anchor View Residence 123456 my question is how do i get it to be shown as 666, ST Avenue #03-09 Anchor View Residence 123456 in FormB in my formB.asp, for the particular code, all i wrote was Code: {Form.address} I am in need of advise, have been stuck here for the past 1 day, not knwing wat to start or how to start. Thank you Ok, i have a javascript that creates a table then appends it to an empty div. This works fine in FF, however it fails to work in IE8. [edit] I have decided to post the entire code since I wasn't having any luck getting any suggestions. Maybe now someone can help me out. Code: function createTable() { var machine = document.Catalog.machine.value; var dSearch = document.Catalog.dSearch.value; var section = document.Catalog.section.value; var x = xmlDoc.getElementsByTagName('record'); var y = xmlDoc.getElementsByTagName('data'); var newEl = document.createElement('TABLE'); newEl.className = 'resultsTab'; var tmp = document.createElement('TBODY'); newEl.appendChild(tmp); var row = document.createElement('TR'); var n = 1; var headings = new Array("Col1", "Col2", "Col3", "Col4", "Col5"); var dcount = 0; //for (t=0;t<10;t++) { for (t=0;t<y[0].childNodes.length;t++) { if (y[0].childNodes[t].tagName == "record") { // it is required for FF to work properly dcount++; } } if (document.Catalog.thumbImg[0].checked) { var container = document.createElement('TH'); var theData = document.createTextNode("Pic"); container.className = "topline1"; container.appendChild(theData); row.appendChild(container); } for (h=0;h<headings.length;h++) { var container = document.createElement('TH'); var theData = document.createTextNode(headings[h]); container.className = 'topline' + n; container.appendChild(theData); row.appendChild(container); n++; } tmp.appendChild(row); switch (searchtype) { case 1: var objRegex = new RegExp(machine); break; case 2: var objRegex = new RegExp(section, "i"); break; case 3: var objRegex = new RegExp(dSearch, "i"); break; default: document.getElementById("replaceTxt").innerHTML = "<p>There was an error processing your request.</p>"; } var rowColor = 1; var noResult = "false"; for (i=0;i<dcount;i++) { var row = document.createElement('TR'); var searcharr = new Array(); for (j=0;j<x[i].childNodes.length;j++) { if (x[i].childNodes[j].nodeType != 1) continue; searcharr.push(x[i].childNodes[j].firstChild.nodeValue); } var searchstrg = searcharr.toString(); if (searchstrg.match(objRegex)) { var t; var m=1; if (document.Catalog.thumbImg[0].checked) { var pn = "images/"+searcharr[2]+".jpg"; var container = document.createElement('TD'); var refLink = document.createElement("A"); refLink.setAttribute('href', "javascript:viewImg(\""+pn+"\")"); var imgHolder = document.createElement("IMG"); imgHolder.setAttribute("src", pn); imgHolder.style.height = "75px"; refLink.appendChild(imgHolder); container.appendChild(refLink); container.className = "img"+rowColor; row.appendChild(container); } for (t=0; t<searcharr.length; t++) { container = document.createElement('TD'); var theData = document.createTextNode(searcharr[t]); container.appendChild(theData); container.className = 'line' + rowColor + '_' + m; row.appendChild(container); m++; } tmp.appendChild(row); rowColor == 1 ? rowColor++ : rowColor--; document.getElementById("replaceTxt").innerHTML = ""; document.getElementById("replaceTxt").appendChild(newEl); noResult = "true"; } } if (noResult=="false") { document.getElementById("replaceTxt").innerHTML = "<h3>Sorry, there was no match to your search. Please try again</h3>"; } } xmlDoc is the xml object from my import xml function. it is working correctly. IE does not give any JS errors, it just does nothing. If I put text in the Code: document.getElementById("replaceTxt").innerHTML field, IE displays the text in the correct spot so I know the code is working. I also verified the data is being written correctly to "newEl" via IE 8 debugger. IE just does not want to append the newEl child to the <div> tag. This is where I assume the problem is. I have 16 links on a page, when each link is clicked, I need to change text that is on the page. This is Page 1 link 1 This Is Page 1 link 2 This is Page 2 ... link 16 This is Page 16 How can I do this? Excuse my ignorance, this is my first JS project I'm a bit of a Javascript noob, so please bear with me! I'm trying to create a piece of code that will check a webpage and replace any instances of a specific line of HTML with another line of HTML. The code I have so far doesn't work, but I have a feeling that's down to my awful Javascript skills! For example, in the following code I'd want to replace all instances of <li><a href="index.pdf">Index</a></li> with <li><a href="contents.pdf">Contents</a></li> Code: <div id="downloads"> <p>Please click on your downloads below:</p> <ul> <li><a href="index.pdf">Index</a></li> <li><a href="chapter1.pdf">Chapter 1</a></li> <li><a href="chapter2.pdf">Chapter 2</a></li> <li><a href="chapter3.pdf">Chapter 3</a></li> <li><a href="credits.pdf">Credits</a></li> </ul> </div> The Javascript I have so far is: Code: <script type="text/javascript"> var aEls = document.getElementsByTagName('a'); for (var i = 0, aEl; aEl = aEls[i]; i++) { aEl.href = aEl.href.replace('index.pdf','contents.pdf'); } Obviously this is meant to just replaces the a href elements, but I got a bit stuck after this! Any pointers would be much appriciated. Hi. I have the following line in my HTML file <table class="bz_buglist" cellspacing="0" cellpadding="4" width="100%"> And I need to use javascript to change this line to <table id="main_table" class="bz_buglist" cellspacing="0" cellpadding="4" width="100%"> . I just need to add the ID part. How can I do this? Is there a method of replacing the line, or a way to "add attribute"? thanks! kev. Code: var bakaBanner; bakaBanner = document.getElementById('head'); if (bakaBanner) { var str=/\/images\/banners\/[A-Za-z0-9_]+.[a-z]+/; document.write(str.replace(/\/images\/banners\/[A-Za-z0-9_]+.[a-z]+/, "http://img218.imageshack.us/img218/5904/revyblacklagoon1.png")); } Alright, here's the deal... This is a script to be used in Greasemonkey. The page this is for changes their banner every 5 minutes, the name changes and it could be either jpg or png. I'm fairly certain my regex itself: \/images\/banners\/[A-Za-z0-9_]+.[a-z]+ Is correct... Here's an example of what it's looking through: Code: <div id="head" style="background-image: url(/images/banners/kiminitodoke.jpg);" > <div id="header_left"> <div id="rss"> My guess is that it has something to do with this line: document.write(str.replace(/\/images\/banners\/[A-Za-z0-9_]+.[a-z]+/, "http://img218.imageshack.us/img218/5904/revyblacklagoon1.png")); I'm new with Javascript, so I don't really understand why it's not working... :/ I know that unlike PHP, NULL in JavaScript must be quoted as a string. Does it matter if you use single or double quote?
|