JavaScript - Loading External Javascript Files
I have an external Javascript file that only works when I put:
Code: <script type="text/javascript" src="external.js"></script> at the end of the HTML page. Does anyone know why it won't work in the head of the page? Thanks Similar TutorialsGreetings, I am looking for either a JavaScript or Coldfusion solution to the following problem. First, there are over 60 million product photos so downloading and resizing the photos using Coldfusion would be very tedious. I would like the display an image within a 100 x 100 pixel container. If the height or width of the image is great than 100 pixels, the image should reduce in size to fit within the 100 x 100 pixel container. I want to avoid pixelation of the images as much as possible. All images are external and not on the local server so I only have an image URL. I would like to hide all images until they are resized appropriately. Does anybody know of a piece of javascript code that can do something similar to this? Sincerely, Travis Walters Hello, I was wondering if it is possible to load external pages (from a different server) into a lightbox, without using a iframe. Any solutions for this? Thanks a lot in advance! Kind regards, Robbert So, 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. I'm trying to program/modify a simple countdown timer in a .js file. I was able to get it to work when I just loaded the index.html file straight from my computer to my browser but it failed once uploaded. Here was the code for my index.html file. Code: <script type="text/javascript" src="countDown2.js"></script> <body> <b id='itgoeshere'>timer should go here</b> <script language ="Javascript"> window.onload = cd() </script> </body> and here is my code for my .js file Code: var days var hours var mins var secs; function cd() { var today = new Date() var eventDate = new Date(2012,0,28,19,19,70) difference = eventDate.getTime() - today.getTime() days = Math.floor(difference / (1000*60*60*24)) difference = difference - days * (1000*60*60*24) hours = Math.floor(difference / (1000*60*60)) difference = difference - hours * (1000*60*60) mins = Math.floor(difference / (1000*60)) difference = difference - mins * (1000*60) secs = Math.floor(difference / (1000)) redo(); } function dis(days,hours,mins,secs) { var disp; disp = days + ":" + hours + ":" + mins + ":" + secs; return(disp); } function redo() { secs--; if(secs == -1) { secs = 59; mins--; if (mins == -1) { mins = 59; hours--; if (hours == -1){ hours = 23; days--;}} } document.getElementById('itgoeshere').innerHTML = dis(days,hours,mins,secs); if((days == 0) && (hours == 0) && (mins == 0) && (secs == 0)) { window.alert("Chris is running."); // change timeout message as required } else { cd = setTimeout("redo()",1000); } } function init() { cd(); } window.onload = init; If I were to just cut and paste my .js code between my <script> it works but I was hopping to use it over again on multiple pages and having only one file to update. Also I'm very new at programming in general so if you see an obvious mistake not related to my question please let me know. Hi everyone, I'm a newbie and this is probably really easy but it just won't work! I've tried looking at various online sources but they are all either too technical or don't seem to work. I'm obviously doing something wrong! The code is posted below, it's not very long so hopefully someone will be able to debug it! Thanks lots! Original page: Code: <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <title>variables</title> </head> <body> <script src="displaydate.js" type="text/javascript"></script> <br> </body> </html> External displaydate.js file: Code: function todaydate(){ var today_date= new Date() var myyear=today_date.getYear() var mymonth=today_date.getMonth()+1 var mytoday=today_date.getDate() document.write(myyear+"/"+mymonth+"/"+mytoday) } Opening the original page in my browser displays nothing. Just a blank page. Any help you can give would be greatly appreciated! Geoff Hey guys. So right now I'm able to execute javascript code on my website without the use of <script> tags. Example: <body onload=alert("cool");></body> What I want to be able to do is insert an external javascript file located at another website using JavaScript code (not script tags). How can this be done? Thanks Hi I need to develop a simple keyword search in external html files(having traversing in directories ability). Is this possible? (in this case php can be used) Please guide me Thanks 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. <body> <script type="text/javascript" src="/khk.php?klub=khk&user=w"></script> This script works fine, but I get a error: line: 2 character: 1 error: character illegal code: 0 url .... Can anybody help?? Hi Guys, I am tiring to create an external java script which is suppose to change a div background color when mouse over. I have a simple Html file as: Code: <html> <head> <script type="text/javascript" src="MouseJs.js"></script> <link rel="stylesheet" type="text/css" href="MouseCSS.css"> <title>Test Mouse Over</title> </head> <body> <div class="box" id="col"> </div> </body> </html> and a CSS file as: Code: .box { width: 20%; height: 100px; background-color: #4D7530; float:left; } and finally I have a java script file as bellow: Code: window.onload = function() { document.getElementById('col').onmouseover = function() { document.col.background-color: #FFFFFF; } } Could you please let me know what i am doing wrong here? Thanks Hi all me again I have this bit of code: Code: <script type="text/javascript"> var testvar = "<? print $cards; ?>"; var name = "<? print $name; ?>"; //Create JavaScript array var testarray = new Array(); //Fill JavaScript array from the converted string testarray = testvar.split(":#:"); var imagesleft = 10; var numclicks = 0; var score = 0; function clickCard (what,where) { var count=0; for(var x = 0; x < testarray.length; x++) { if(what == testarray[x]) { count++; } } if(count==1) { alert("unique"); document.images[where].src = "./images/blank.png"; imagesleft--; score = score+20; clicks.innerHTML = "Unique Images to find = " + imagesleft; if(imagesleft==0) { score = score - numclicks; var r=confirm("Do you want to enter your score in the highscore table?"); if (r==true) { document.getElementById('score').value = score; document.forms["highscore"].submit(); } else { var t=confirm("Do you want to play again?"); if (t==true) { document.location.reload(); } else { window.close(); } } } } else { alert("Not unique"); } numclicks++; pairs.innerHTML = "Number of Clicks = " + numclicks; } </script> which works a treat but when it is put into a external js file all I get is the alert Not unique and nothing else! any ideas why? Dear All, I got a problem with order of loading external javascript file. I have 2 external javascript files: jsFile1. js and jsFile2.js. And file jsFile2 use an object in file jsFile1.js. So file jsFile2.js have to load after file jsFile1.js. But sometime I got runtime error, because file jsFile2.js is loaded before jsFile1.js I added 2 js files by: document.getElementsByTagName('head')[0].appendChild(jsFile1.js); document.getElementsByTagName('head')[0].appendChild(jsFile2.js); Does anyone know how to solve this problem. Please help. Thank you. Best Regards. Hi, I've posted a previous thread where the code I had wasn't running. I copied that into the head section and it worked. I'd like to know why it doesn't work in the javascript.js file. Thank you very much. hello, I have designed a web site. but I want to protect my external javascript(and css also) from outside people, who steal my javascript. can anyone tell me a method to hide external javascript(and css) from these knaves...!!! thank you Hi, is it possible to make a external javascript link by giving all the external links a class name then use getelementbytagname in the js file with a function to alert the hes leaving the website and let him choose if he wants to stay or leave. well thats what im trying to do but i dont know how to write the function for it maybe i could get a suggestion or a link to agood tutorial. / thanks lisa Hi, well i searched at google and was not exactly able to find what i was looking for, i am looking for a script the shows by logo while loading the game at back end, shows loading percentage or bar representing how game is loaded and then makes the my logo disappear once the game is loaded e-g like this site has used http://www.gamegape.com/en-2095-elemental-battles.html if some thing like this is not available can someone atleast tell me how this site has done it, so we could copy it from them ^_^ I know this was here previously but no solution was found and I wonder if someone could help. JavaScript loads before even DOM is fully loaded but only in Chrome browser. I know I could use setTimeout function but it's now ideal in my case. I am working on a program based on Chromium and have a html page inside it. Page has 4 images that resize (useing javascript) depending on window size Here is load finction Code: window.onload = function(){ window.document.body.onload = initDocument; }; function initDocument() { stretchFit("divMy", "bg"); stretchFit("divG", "bgG"); stretchFit("divTech", "bgTech"); stretchFit("divKB", "bgKB"); } Any ideas how to load function after DOM is loaded? Hi guys, I am new here and am looking for a bit of help! I am building a website for a friend and am using Javascript. When I preview the site from my computer in Chrome/Firefox then all the JS elements render correctly. I am using jCarouselLite by the way and have used HTML Boilerplate too. However, when I upload the site the Carousel does not work... Also, I seem to have a lot of scripts kicking around inside the html so I will give you a list of those, but here are my external JS files so my question before posting up all the code are 1.) what is the problem with rendering the JS elements live on t'internet, and 2.) can I reduce the amount of JS files/scripts to help page loading times? css_browser_select.js modernizr-1.7.min.js jquery-1.6.1.min.js jcarousellite.js functions.js Code: $(document).ready(function(){ // Activate the main slider $("#mainSlider").jcarousellite({ btnNext: "#sliderBtnNext", btnPrev: "#sliderBtnPrev", visible: 1 }); }); plugins.js script.js jquery.placeholder.min.js and this is the code inside my HTML: Head: Code: <!-- CSS: implied media="all" --> <link rel="stylesheet" href="css/style.css" media="screen"> <link rel="stylesheet" media="handheld" href="css/handheld.css"> <!-- CSS Browser Compatibility --> <script src="js/css_browser_select.js"></script> <!-- Mobile viewport optimized: j.mp/bplateviewport --> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <!-- All JavaScript at the bottom, except for Modernizr which enables HTML5 elements & feature detects --> <script src="js/libs/modernizr-1.7.min.js"></script> /Head and this is at the bottom of the Body: Code: <script src="js/libs/jquery-1.6.1.min.js"></script> <script src="js/libs/jcarousellite.js"></script> <script src="js/libs/functions.js"></script> <!-- Grab Google CDN's jQuery, with a protocol relative URL; fall back to local if necessary --> <script src="//ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script> <script>window.jQuery || document.write("<script src='js/libs/jquery-1.6.1.min.js'>\x3C/script>")</script> <!-- scripts concatenated and minified via ant build script--> <script src="js/plugins.js"></script> <script src="js/script.js"></script> <!-- THIS MAY NEED TO BE REDONE! Placeholder for Forms --> <script src="js/libs/jquery.placeholder.min.js"></script> <script> if (!Modernizr.input.placeholder){ $('input[placeholder], textarea[placeholder]').placeholder(); } </script> <!-- Form Submit --> <script> function submitForm() { document.contactPhone.submit(); } </script> <!-- Google Analytics Script - Change UA-XXXXX-X to be your site's ID --> <script> var _gaq=[["_setAccount","UA-XXXXX-X"],["_trackPageview"]]; (function(d,t){var g=d.createElement(t),s=d.getElementsByTagName(t)[0];g.async=1; g.src=("https:"==location.protocol?"//ssl":"//www")+".google-analytics.com/ga.js"; s.parentNode.insertBefore(g,s)}(document,"script")); </script> <!-- Bookmark Script --> <script> function bookmark_us(url, title){ if (window.sidebar) // firefox window.sidebar.addPanel(title, url, ""); else if(window.opera && window.print){ // opera var elem = document.createElement('a'); elem.setAttribute('href',url); elem.setAttribute('title',title); elem.setAttribute('rel','sidebar'); elem.click(); } else if(document.all)// ie window.external.AddFavorite(url, title); } </script> Hi, im having a problem adding a frame busting killer that counteracts a frame killer script on sites so i can load them inside my iframes.. here is the code i use <?php $result = mysql_query("SELECT ru.id, ru.username, ru.owid FROM raidbar_users ru LEFT JOIN raidbar_groups rg ON ru.groupid = rg.id WHERE rg.id = '".(int)$_REQUEST['group']."'") or die(mysql_error()); $myRaidid = raidid(); if(isset($_GET['gm'])) { echo '<FRAMESET rows="*,*,*,30" frameborder="0">' . "\n"; echo ' <FRAMESET cols="*,*" frameborder="0" scrolling="no">' . "\n"; $i = 0; while($row = mysql_fetch_array($result)) { if ($i == 2) { echo ' </FRAMESET>' . "\n"; echo ' <FRAMESET cols="*,*" frameborder="0" scrolling="no">' . "\n"; $i = 0; } echo ' <FRAME src="http://'.$server[$siteConfig['userServer']].'.***********/joinraid.php?raidid=' . $myRaidid . '&suid=' . $row['owid'] . '&serverid='.$siteConfig['userServer'].'">' . "\n"; $i++; } echo ' <FRAME src="">' . "\n"; echo ' </FRAMESET>' . "\n"; echo ' <FRAMESET frameborder="0" scrolling="no">' . "\n"; echo ' <FRAME src="http://'.$server[$siteConfig['userServer']].'.***********/raidmembers.php?raidid=' . $myRaidid . '">' . "\n"; echo ' </FRAMESET>' . "\n"; echo '</FRAMESET>' . "\n"; } else { echo '<table cellspacing=1 cellpadding=1>' . "\n"; echo '<tr>' . "\n"; $i = 0; while($row = mysql_fetch_array($result)) { if ($i == 2) { echo '</tr>' . "\n"; echo '<tr>' . "\n"; $i = 0; } echo ' <td><iframe src="./acct.php?suid=' . $row['owid'] . '" width=450 height=225 scrolling=no frameborder=0></iframe>' . "\n"; $i++; } echo '</tr>' . "\n"; echo '<tr>' . "\n"; echo ' <td><iframe src=http://'.$server[$siteConfig['userServer']].'.***********/raidmembers.php?raidid=' . raidid() . '&serverid='.$siteConfig['userServer'].' width=250 height=30 scrolling=no></iframe>' . "\n"; echo '</tr>' . "\n"; echo '</table>' . "\n"; } ?> Now im told to use the following.. <script type="text/javascript"> var prevent_bust = 0 window.onbeforeunload = function() { prevent_bust++ } setInterval(function() { if (prevent_bust > 0) { prevent_bust -= 2 window.top.location = 'http://server-which-responds-with-204.com' } }, 1) </script> or var prevent_bust = 0; // Event handler to catch execution of the busting script. window.onbeforeunload = function() { prevent_bust++ }; // Continuously monitor whether busting script has fired. setInterval(function() { if (prevent_bust > 0) { // Yes: it has fired. prevent_bust -= 2; // Avoid further action. // Get a 'No Content' status which keeps us on the same page. window.top.location = 'http://server-which-responds-with-204.com'; } }, 1); But the window.top.location i dont know how to incorporate that to work. Can anyone help? I need to check the whether an external url like http://www.somesite.com exists or not using javascript. I have a ajax method for it, Code: function checkUrl(url) { var xmlhttp=false; if (!xmlhttp && typeof XMLHttpRequest!='undefined') { try { xmlhttp = new XMLHttpRequest(); } catch (e) { xmlhttp=false; } } if (!xmlhttp && window.createRequest) { try { xmlhttp = window.createRequest(); } catch (e) { xmlhttp=false; } } xmlhttp.onreadystatechange=function() { if (xmlhttp.readyState==4) { if (xmlhttp.status==200) { alert("URL Exists!"); } else if (xmlhttp.status==404) { alert("URL doesn't exist!"); } else { alert("Status is "+xmlhttp.status); } } } xmlhttp.open("HEAD", url ,true); xmlhttp.send(); } But is not successful for finding existence of external urls. Any help... Thanks in advance.. |