JavaScript - Displaying Content Based Upon Internet Connectivity
I have a site that can be downloaded and run on a closed network (not needing an active Internet connection). I'd like a page that displays live data to a user with Internet connectivity (I can do this) but display "canned" data when the user is without an internet connection...and this difference in page display is transparent to the user. I know this can be done with php but the user without Internet connectivity will likely not be able to run php locally so the page must be an .htm file. I there a javascript somewhere that does this?Any help is greatly appreciated.
Similar TutorialsHi, I'm using javascript in addition to a web service (BTBuckets) to display different content to visitors based on actions they take on my site. The javascript is working fine, but I noticed that if I simulate BTBuckets being disabled using Firefox Adblock none of the content shows up. So in the off chance of the service going offline it'll leave some pretty funky holes in the my content. I tried <noscript> tags which works with javascript off, but the content is still blank when I disable BTBuckets. I'm wondering if there's a way to display the default content if the service is unavailable? Here's the code I'm using: In the head: Code: <script type="text/javascript"> //<![CDATA[[ $BTB={s:XXXXX}; $BTB.jsh="http://static.btbuckets.com/bt.js"; //]]> </script> <script type="text/javascript"> document.write(unescape("%3Cscript src='" + $BTB.jsh.replace(/(https?:)/i,document.location.protocol) + "' type='text/javascript'%3E%3C/script%3E")); </script> The code in the body used to replace an image depending on visitor behavior: Code: <script type="text/javascript"> var _t = ""; if ($BTB.clusters["ppc_visitors"]) { _t = "\"images/top-photo-tracking-number.jpg\" alt=\"Call Toll-Free: 1-800-XXX-XXXX\">"; } else { _t = "\"images/top-photo.jpg\" alt=\"Call Toll-Free: 1-800-XXX-XXXX\">"; } document.write('<img src= ' + _t ); </script> <noscript><img src="images/top-photo.jpg" alt="Call Toll-Free: 1-800-XXX-XXXX"></noscript> Hi, I know this is a very bad idea, but I need to do it just to prove a point. I was wondering if it is possible to remove content from a website based on the screen resolution, rather than have to redirect to a new URL. For example: Code: <if height greater than 800px> Lots of code <else> <br/> </if> Thank you I am very inexperienced with javasciprt. I am designing a form in coldfusion, and want some dynamic action to take place. My users will be offered 2 selections via radio buttons. Depending on which radio button they select, they will get a few more radio buttons to choose from. I have been told that this can be handled in javascript. So I am appealing to the javascript programmer nation for some assistance in this endeavor. Any help would be greatly appreciated, Thanks. I am pretty sure this is a javascript function. I want it where when a person chooses an option in a select box, it displays content. Here is the page it'd be on. http://www.rodgame.org/register.html So for Class: once they select something, in the black area in the middle bottom, it'd show a description of that class. How would I do something like this? You've all seen it before banner codes/rss feed displayers/twitter feeds/etc etc all you do is copy and paste a <script src="http://somewebserver/display.js"></script> somewhere on your website and it retrieves the html from the remote server and displays it on your site. My question as simple as it sounds is how the hell does this stuff work? I have a back end php page that pulls the required information from my DB based off a userid passed to it ie: mywebserver.com/display.php?id=xxxx Is the javascript just a simple ajax call to my php page passing straight on the userid passed to it or is there something more complex to it? I was always under the impression you couldn't do remote ajax calls to a page on a different server, which if I get this right a script off my server included on another domain becomes a member script of that domain and not my own? I am one problem. When i click a link a some information in html is to be displayed on the screen. I have written code for that. But before i click the link i am able to display the content. Please look into my code and give some suggestions: <html> <head> </head> <body> <center> <table> <tr> <td> <a href="javascript:Chg1()">Add Required (Features)</a> </td> <td> <a href="javascript:chg2()">Add via Search</a> </td> <td> <a href="javascript:Chg3()">Add via List</a> </td> </tr> </table> </center> function chg2() { document.write(<b> Type Model Feature Relationship Search and Add </b>);s <table> <tr> <td> Type<input type="text" id="type" name="type" value=""> </td> <td> Document Number<input type="text" id="doc" name="doc" value=""> </td> </tr> <tr> <td> Model<input type="text" id="model" name="model" value=""> </td> <td> Promoted<input type="text" id="promoted" name="promoted" value=""> </td> </tr> <tr> <td> Feature<input type="text" id="feature" name="feature" value=""> </td> </tr> </table> } </script> </body> Hello! I'm currently working on trying to target an anchor based on what the contents of their 'title' attribute is, then apply a href to that anchor. Here is what I have so far Code: function(j){ $meh = $('a#mapThisLocation'); if ($meh.attr('title' == '192-dodge')){ $meh.attr('href', 'http://www.google.com') } }; the current html of that anchor when the page loads follows. Code: <a id="mapThisLocation" title="192-dodge"> any thoughts? Hi Guys, i am wondering if there is a way to have an auto Complete form field from a db table data ? thanks Hi ya all, how can I show / hide the content of sub divs based on whether the input is != or = and be able to repeat this. I tried to hide the sub divs using , onclick if bla bla = '' ; Code: document.getElementById('hideme').innerHTML = ''; which works, but once I try to enter a new input, then nothing happens, even if the content of the sub divs is = input thx Hi all, I'm not sure if this is a Javascript question or PHP, so if it needs to be moved can an admin please do so... Anyway, basically I have the following code: Code: <a href = "javascript:void(0)" onclick = "document.getElementById('light').style.display='block';document.getElementById('fade').style.display='block'">View Availability</a> This pops up a divs with a black alpha background, so that it appears the new content is displaying over the top of the current content. This all works fine, however the content I am displaying in the top level div is (or should be) dynamic. In order for the content to be useful I need to grab the id. Normally I would simply do this: Code: <a href = "url.php?uniqueidentifier=<?php echo $row['id'];?>" onclick = "document.getElementById('light').style.display='block';document.getElementById('fade').style.display='block'">View Availability</a> However what happens in this instance is that the page loads with the javascript and the id in the url but it then disappears... Has anyone got any ideas on how I might be able to get around this? Many thanks, Greens85 Hi, I'm new to Javascript, so bear with me. I'm trying to use a script that replaces the contents of a div, based on div id's. I've gotten it to work how I want he http://www.sixnations.be/home1.html But can't get it to work here, and I'm not sure why: http://www.sixnations.be/menu.html Relevent code, Javascript: Code: function changeMenu(obj) { if (obj == 'food') { //alert('food'); var fd = document.getElementById('food'); fd.style.display = 'inline'; var fdi = document.getElementById('foodImages'); fdi.style.display = 'inline'; var dr = document.getElementById('drink'); dr.style.display = 'none'; var dri = document.getElementById('drinkImages'); dri.style.display = 'none'; } else if (obj == 'drink') { //alert('drink'); var fd = document.getElementById('food'); fd.style.display = 'none'; var fdi = document.getElementById('foodImages'); fdi.style.display = 'none'; var dr = document.getElementById('drink'); dr.style.display = 'inline'; var dri = document.getElementById('drinkImages'); dri.style.display = 'inline'; } } HTML (the data's tabular, hence the tables): CSS: Code: /*-- MAIN CONTENT --*/ .maincont { width: 930px; margin: auto; margin-top: 10px; overflow: auto; } .backcont { position: relative; width: 620px; margin-right: 296px; } .backrightcont { float: right; width: 296px; } .backtop, #info_En, #info_Fr, #info_It, #drink, #food, .backrighttop { background-image: url(../sixnations_images/backtop.png); background-repeat: repeat-x; background-position: bottom; border-right: 1px solid #21201C; border-left: 1px solid #21201C; width: 100%; height: 57px; text-align: center; } .backbottom { background-image: url(../sixnations_images/backbottom.png); } #info_En, #info_Fr, #info_It, #food, #drink { background-image: url(../sixnations_images/contentback4.png); background-repeat: repeat; padding-bottom: 30px; text-align: left; height: auto; } .backright, .backrighttop, .backrightbottom { width: 100%; } .backright { background-image: url(../sixnations_images/backright.png); } .backrighttop { background-image: url(../sixnations_images/backtop2.png); background-position: top; border: 0; } .backrightbottom { height: 50px; background-image: url(../sixnations_images/backrightbottom.png); border: 0; } .backrighttop h1, .backright h1 { font-family: 'Cambria', Palatino, Georgia, serif; font-size: 1.6em; color: #eee; line-height: 70px; text-align: center; } .backright h1 { width: 95%; line-height: normal; border-top:1px dashed #333; padding-top: 15px; } #noborder { border:0; } .twitter { margin-left: 15px; } #info_Fr, #info_It, #drink { display: none; } .lang, #info_En p, #info_En h1, #info_Fr p, #info_Fr h1, #info_It p, #info_It h1, #food h1, #food p, #drink h1, #drink p { width: 71%; margin: auto; } #info_En h1, #info_Fr h1, #info_It h1, #food h1, #drink h1 { font-family: 'GothamBook','Cambria', Georgia, serif; font-size: 2.5em; color: #000; padding-bottom: 10px; padding-top: 20px; margin-bottom: 15px; font-variant: small-caps; letter-spacing:.1em; text-align: center; border-bottom: 1px dashed #777; } .lang { margin-top: 35px; padding-top: 5px; border-top: 1px dashed #777; font-size: 1em; font-variant: small-caps; text-align: right; color: #777; } .lang a:hover { background-color: #777; color: #eee; } /*-- MAIN CONTENT -- SPORTS ON TV / FOOD & DRINK --*/ table.sports, table.menu1 { width: 90%; margin: auto; } table.sports thead td, table.menu1 thead td { font-size: 1.3em; font-variant: small-caps; color: #777; border-bottom: 1px dotted #999; width: 100%; padding-top: 20px; } table.sports tr, table.menu1 tr { border-bottom: 1px dotted #999; } table.menu1 tr { border: 0; } table.sports td { padding: 7px; } table.menu1 td { border:0; padding: 8px; } table.sports td.foot, table.sports td.rugby { background-image: url(../sixnations_images/ball1.png); background-repeat: no-repeat; background-position: bottom left; padding-left: 35px; } table.sports td.foot { background-image: url(../sixnations_images/ball2.png); } table.menu1 td.desc { color: #888; font-style: italic; padding-top: 0px; font-size: .9em; } Any ideas? I'm using the script below in a custom HTML to generate a random line of text (not with the text shown here). This works fine BUT; I want it to go randomly through the WHOLE list without repeating lines that already have been printed. As it is now, a line of text might be printed several times in a row, which is a little annoying. I'm using a refresh button for generating a new line of text. Alternatively, How can I just make it display in the order shown and just re-arrange the content so it seems random to the user? Random would the best though... Any ideas?? : ) Code: <script language="JavaScript"> <!-- var r_text = new Array (); r_text[0] = "All the leaves are brown"; r_text[1] = "And the sky is grey"; r_text[2] = "I've been for a walk"; r_text[3] = "On a winter's day"; r_text[4] = "I'd be safe and warm"; r_text[5] = "If I was in L.A."; r_text[6] = "California dreaming, On such a winter's day"; var i = Math.floor(7*Math.random()) document.write(r_text[i]); //--> </script> Ahoy, Lemme try to explain this as best as I can. Bullet points might help: When someone clicks on an image here (http://gta.kwivia.co.uk/gta-iv/), the rest of the images collapse and become invisible Below the image, some links appear Also, there will be a "show other images" button which will then show the rest of the images http://gta.kwivia.co.uk/gta-iv/ I will appreciate all solutions to this problem. If you need to know anything, simply ask me. Hi all, I am using xmlhttp.open();xmlhttp.send(); to send a php content to a div. This php content is again using the same method to get php content from a further page. The content of the div, does not seem to be using the css and javascript files defined in the calling pages <head> section. Does anyone know why this is? Is there a workaround or solution to this problem? It might be easier to understand looking at the code, so Background info: Javascript file: scripts.js client.php ----> loads data from: display_client.php display_client.php ----> loads data from: display_brand.php Code: client.php http://pastebin.com/4EFn9YRf display_client.php http://pastebin.com/BGZAKre2 display_brand.php http://pastebin.com/0a4Pg3gg scripts.js http://pastebin.com/er4dkmPc Thanks! Hi There, Can anyone explain why the following XMLHttpRequest.open call fails on IE browsers, but works fine in Firefox and Chrome? Code: <html> <head> </head> <script type="text/javascript"> if( window.XMLHttpRequest ) { xhttp=new XMLHttpRequest(); } else { xhttp=new ActiveXObject("Microsoft.XMLHTTP"); } xhttp.open("GET","test.xml",false); // I show an "access is denied error in IE" xhttp.send(""); document.write( xhttp.responseXML.getElementsByTagName("simple")[0].childNodes[0].nodeValue ); </script> <body> </body> </html> The "text.xml" file resides in the same location (local HDD folder on the pc this is running on) as the html page. And the contents of "test.xml" are shown below: Code: <simple> Hello </simple> Obviously its just a very simple example that should just display "Hello" when loaded, but it fails to work in IE. Hi there - I was wondering if anyone out there could help me I'm redoing my site from many years ago - www.industrialarts.co.uk It contains a "Conveyor" - to which I've always wanted to add a "Lightbox" effect. Well - the good news is that I've managed to get a test page up and running and it's doing exactly what I want it to in Firefox, Chrome, Opera and in Safari However .. in Internet Explorer 8 .. it ain't good. The scripts on the page seem not to work at all. (In Internet Explorer 7, it's worse as the formatting is haywire too - but I'll try to fix one thing at a time) http://www.industrialarts.co.uk/test/chairs/chairs.html So - if anybody could be good enough to take a look at my test page and offer any suggestions for getting it running on Internet Explorer too .. or just where to look for answers - I'd be massively grateful My apologies also as I'm a dabbler with this stuff (normally a woodworker) Cheers, Jol i'm looking for a function to check for the browser version and NOT run a script if the user is using internet explorer 7 or less something like <!--[if gte IE 7]> alert(internet explorer 6 sucks) <!--[else]> alert(internet explorer 7 or greater is better but it still sucks) <![endif]--> and if i just use "lte IE 7" instead of gte IE 7 it will exclude firefox... so that's why i prefer to use a "else" statement.... instead you got something better to suggest thanks!! I am using HAPedit for HTML/Javascript and it used to work alright by clicking Display -> Browse with -> Default Browser(Internet Explorer). But since last one or two days it gives the following error "The page cannot be displayed" and the following is shown in the URL bar http://localhost/helloworld.html 2. But, however, if I navigate to the file by using File -> Open of the IE, the result is shown correctly. 3. What has gone wrong?? I have javascript code in my site. It works in FireFox but doesn't work in IE. The page is http://omidpand.ir/search.html First select something from first combobox when u open second combobox the javascript code should change latin characters with persian one, but it doesn't do it. |