We have a bunch of staff that are in remote offices which lose network connection frequently. Our staff are not IT-focused so they don't do technical troubleshooting very well. I would like to put a local default web page on their PC that simply checks if they can connect to our network, if they can load our IntrAnet, if not, load an offline page that gives them cartoon illustrations of how to troubleshoot their problem. I was thinking a local html file using Javascript might do the job but I don't find any examples. Does anyone have a suggestion? Thanks,
<script> function error() { this.src = 'localpicture'; } </script> <img src='http://www.google.ro/intl/en_com/images/srpr/logo1w.png' onerror='javascript:error();' /> HTML:
I created a simple HTML file and placed it in the root of c:\ (see below). I changed the file permissions to EVERYONE FULL permissions. I then placed an image in the same location as the HTML C:\DarkIsTheSun.jpg. MY TEST: I opened file:///C:/testit.html from Internet Explorer -- I got the Google logo I DISABLED my network adaptor to simulate being offline I got a broken image I was expecting to see the local image - 'DarkIsTheSun.jpg' - instead of a broken image link. Am I doing something wrong? <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01Transitional//EN"> <html> <head><title></title> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> <script> function error() { this.src = 'DarkIsTheSun.jpg'; } </script> </head> <body> <img src='http://www.google.ro/intl/en_com/images/srpr/logo1w.png' onerror='javascript:error();' /> </body> </html> Code (markup):
When I tested it , it worked fine for me... try the this.src = '' to contain the absolute path + image ( C:\DarkIsTheSun.jpg ) But it should work fine though.
Here is a better example , tested in all browsers <!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" xml:lang="en" lang="en"> <head> <meta http-equiv="content-type" content="text/html; charset=iso-8859-1" /> <script> function testConnection() { var online = window.navigator.onLine; if (!online){ document.getElementById('image').style.display = 'block'; } else { window.location = 'http://www.google.com'; } } window.onload = testConnection; </script> <style> #image { display : none; } </style> </head> <body> <img src='DarkIsTheSun.jpg' id='image' /> </body> </html> HTML:
When I tested the code above it seemed to work fine... But when I tested it again today it didn't... So I came up with this : <!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" xml:lang="en" lang="en"> <head> <meta http-equiv="content-type" content="text/html; charset=iso-8859-1" /> <script> var xmlhttp function ConnectToNet(url) { xmlhttp=null; try { netscape.security.PrivilegeManager.enablePrivilege("UniversalBrowserRead"); } catch (e) { } if (window.XMLHttpRequest){ xmlhttp=new XMLHttpRequest() } else if (window.ActiveXObject) { xmlhttp=new ActiveXObject("Microsoft.XMLHTTP") } if (xmlhttp!=null){ xmlhttp.onreadystatechange=state_Change xmlhttp.open("GET",url,true) xmlhttp.send(null) } else { alert("Your browser does not support XMLHTTP.") } } function state_Change() { if (xmlhttp.readyState==4) { try{ if (xmlhttp.status==200) { window.location = 'http://www.google.com'; } else { document.getElementById('image').style.display = 'block'; } } catch(err){ document.getElementById('image').style.display = 'block'; setTimeout("ConnectToNet('http://www.google.com')",20000); } } } function test() { ConnectToNet('http://www.google.com'); } window.onload = test; </script> <style> #image { display : none; } </style> </head> <body> <img src='test.png' id='image' /> </body> </html> HTML:
The problem is that Internet Explorer will not run local scripts unless the user allows it (by clicking the yellow bar and 'alowing' the content). This can be changed in the internet explorer settings to 'Always allow' but by default it will not. tvoodoo: No browser will allow you to connect to a remote server using ajax. I am not sure of the restrictions when the script is ran locally though.
works with ie8 and ff3. not sure about the rest. <script type="text/javascript"> if(navigator.onLine) { window.location="http://www.google.com"; } </script> Code (markup):
camjohnson , it won't allow you to get results from the remote host , but to check if its offline / online it allows you... google.
ok, but navigator.onLine should work with all modern browsers that comply with w3c standards and would be a much simpler solution...