JavaScript - External Hover Script Not Working
I'm working on some code to create hover text that follows the mouse.
Now, the code works fine when the javascript is included on the page: (internal script) http://cory.wellen.googlepages.com/hovertest2.html However, when I try to move the code out to an external script, it doesn't work. I've tried looking all over to see what the problem is, but 99% of those with external script problems have errors in syntax or location of the source script. Please help! (javascript) http://cory.wellen.googlepages.com/hover.js (external script) http://cory.wellen.googlepages.com/h..._external.html Similar TutorialsHi 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? If multiple pages reference the same external JS sheet, does the sheet reload every time you go to a new page or does it stay in memory?
Here is a .js file to hack ie6,but it doesn't work when i put it out of the .html file.It can woking only in the .html file. It's fine in the .html file. Below: Code: <html> <head> <script type="text/javascript"> sfHover =function() { var sfEls = document.getElementById("nav").getElementsByTagName("LI"); for (var i=0; i<sfEls.length; i++) { sfEls[i].onmouseover=function() { this.className+=" sfhover"; } sfEls[i].onmouseout=function() { this.className=this.className.replace(new RegExp(" sfhover\\b"), ""); } } } if (window.attachEvent) window.attachEvent("onload", sfHover); </script> </head> <body> ...... ...... </body> </html> It's not working if external .js file.below: Code: <script type="text/javascript" src="suckerfish.js"></script> note:I haven't added the <script type="text/javascript">...<script> code to the .js file. any help will be good. Hi, I need some help here- below is the script I'm trying to externalize but whatever I've tried doesn't work (the Login button doesn't nothing when the script is external). Thanks!!! <form name="login" autocomplete="off"> <p>User Name : <input type="text" name="username"></p> <p>Password : <input type="password" name="password"></p> <input type="button" value="Login" name="Submit" align="right" onClick="Login()";> </p> </form> </div> <script language="JavaScript"> function Login(){ var done=0; var username=document.login.username.value; username=username.toLowerCase(); var password=document.login.password.value; password=password.toLowerCase(); if (username=="bruceclements" && password=="berlin") { window.location="users/bruceclements.html"; done=1; } if (username=="free" && password=="java") { window.location="page2.html"; done=1; } if (username=="member3" && password=="password3") { window.location="page3.html"; done=1; } if (done==0) { alert("Invalid login!"); } } </script> I have two pages one html page and one Javascript page index.html and script.js. I want to call the javascript page 3 times to display 3 images. How would I do this from my html page. script.js Code: <script language="JavaScript"> <!-- /* Random Image Link Script By Website Abstraction (http://www.wsabstract.com) and Java-scripts.net (http://www.java-scripts.net) */ function random_imglink(){ var myimages=new Array() //specify random images below. You can have as many as you wish myimages[1]="http://flashmajic.com/Google/atomica/atomicasmallicon.jpg" myimages[2]="http://flashmajic.com/Google/atomica/atomicasmallicon.jpg" myimages[3]="http://flashmajic.com/Google/atomica/atomicasmallicon.jpg" //specify corresponding links below var imagelinks=new Array() imagelinks[1]="http://www.wsabstract.com" imagelinks[2]="http://www.dynamicdrive.com" imagelinks[3]="http://www.java-scripts.net" var ry=Math.floor(Math.random()*myimages.length) if (ry==0) ry=1 document.write('<a href='+'"'+imagelinks[ry]+'"'+'><img src="'+myimages[ry]+'" border=2 hspace=1></a>') } random_imglink() //--> </script> index.html Code: <!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"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Untitled Document</title> </head> <body> ????? How would I call that script 3 times to display 3 random images? </body> </html> 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 What im trying to do is to dynamically call an external javascript file. The script once called will provide variables for another function. I have tried using this function PHP Code: function loadjscssfile(filename, filetype){ if (filetype=="js"){ //if filename is a external JavaScript file var fileref=document.createElement('script') fileref.setAttribute("type","text/javascript") fileref.setAttribute("src", filename) } else if (filetype=="css"){ //if filename is an external CSS file var fileref=document.createElement("link") fileref.setAttribute("rel", "stylesheet") fileref.setAttribute("type", "text/css") fileref.setAttribute("href", filename) } if (typeof fileref!="undefined") document.getElementsByTagName("head")[0].appendChild(fileref) } loadjscssfile("myscript.js", "js") //dynamically load and add this .js file loadjscssfile("javascript.php", "js") //dynamically load "javascript.php" as a J which works.The problem is that variables can not be passed through from the external script to the parent script. I understand why this is, but i am wondering if there are other ways to load (or refresh) an external script? I'm new to JavaScript, I just finished some basic things, like getAttribute, setAttribute, getElementByID etc. I understand that inline javascript isn't the best way to go, and all the JavaScript should go on an external JS file. I also know that you should be able to downgrade gracefully, allowing people whose browser do not/blocked javascript to still use the site. So I just want to do a simple go back function in an external javascript, however it's not exactly working. This is my JS code: Code: window.load = preparePage(); function preparePage(){ if (!document.getElementById()) return false; if (!document.getElementByTagName()) return false; var backDiv = document.getElementByID("back"); links.onclick = function(){ history.go(-1); return false; } } Here is my HTML code Code: <div class="back"> <a href="http://forum.thekks.net">Back</a> </div> I have the following code: Quote: <form id="registration" action="/cgi-bin/registration.cgi" method="POST" onsubmit="return control()"> <fieldset> <legend>Fill up this module</legend> Private <input id="private" type="radio" name="type" value="private" onclick="return addPrivate()"/><br/> Community/Organization <input id="organization" type="radio" name="type" onclick="alert('Organization')"/><br/> <br/> and the following script: Quote: addPrivate() { alert('Private'); } but alert windows doesn't not appear. Where is the problem? Hi I'm trying to load a part of a page (that has script in it) into another page using jquery. However, though the html loads in correctly, none of the script is working. I'm using code from http://css-tricks.com/video-screenca...namic-content/ ie. the pages all work without java (static pages) and when java is enabled, instead of going to bio.html you get taken to ..#bio.html. However if I've got any script I would like to be loaded .. ie. lightbox gallery or even a simple jav split and put back together email address hider. Any help greatly appreciated. I'm not very clued up about jquery at the moment unfortunately and though I've been trying to read and learn, alot is going over my head.. Not sure how best it is to show you the page as it's not live yet. Maybe if it helps I can upload a zip of the site. It's a simple 6 page musician site. Though my code is exactly like the css-tricks page, just that I have a lightbox on one page (which loads fine if there's no hash in the address - but when hash is there, it shows thumbnails, and when you click one, it just takes you to the larger .jpg destination page (no lightboxness etc).) Thanks I have the following JavaScript (see below). The script requests an XML file from the server and displays it on the page. The script works fine when the requested XML file is stored on the same server as the script. The problem is when I try requesting an XML file from an external server such as the National Weather Service. I get an error. If I take the XML file from the National Weather Service and save it to my server it works. Why can't I use my script to request XML files stored on external servers? Thanks in advance for any help. Javascript Code Code: window.onload = initAll; var xhr = false; function initAll() { document.getElementById("makeTextRequest").onclick = getNewFile; document.getElementById("makeXMLRequest").onclick = getNewFile; } function getNewFile() { makeRequest(this.href); return false; } function makeRequest(url) { if (window.XMLHttpRequest) { xhr = new XMLHttpRequest(); } else { if (window.ActiveXObject) { try { xhr = new ActiveXObject("Microsoft.XMLHTTP"); } catch (e) { } } } if (xhr) { xhr.onreadystatechange = showContents; xhr.open("GET", url, true); xhr.send(null); } else { document.getElementById("updateArea").innerHTML = "Sorry, but I couldn't create an XMLHttpRequest"; } } function showContents() { if (xhr.readyState == 4) { if (xhr.status == 200) { if (xhr.responseXML && xhr.responseXML.contentType=="text/xml") { var outMsg = xhr.responseXML.getElementsByTagName("choices")[0].textContent; } else { var outMsg = xhr.responseText; } } else { var outMsg = "There was a problem with the request " + xhr.status; } document.getElementById("updateArea").innerHTML = outMsg; } } HTML Code Code: <!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"> <head> <title>My First Ajax Script</title> <script type="text/javascript" src="script01.js"></script> </head> <body> <p><a id="makeXMLRequest" href="http://www.weather.gov/xml/current_obs/KOJC.xml">Request an XML file</a></p> <div id="updateArea"> </div> </body> </html> We have an ASP website which everything works fine in pre-IE8, firefox and even our iPhone browsers but not IE8. I know what the problem is and where the problem is but don't know how to fix it, it should be pretty simple but I am not a developer...just trying to fix this one problem When the page loads it is supposed to automatically fill in a text box with the word: No This is the javascript that is supposed to do that: Code: <script type="text/javascript"> function statusdefault(oSel) { status = 'No'; document.getElementById('theLabel5').value = status; } </script> and this shows the onload line: Code: <body onload="statusdefault(this)" bgcolor="#FFFFFF" background="images/background_stripe.jpg" text="#000000" link="#CCCCCC" vlink="#CCCCCC" alink="#CCCCCC" leftmargin="0" topmargin="10" marginwidth="0" marginheight="10"> <form action="<%=MM_editAction%>" method="POST" name="frmDetail" id="frmDetail"> additionally when someone changes a selection in one of the comboboxes it should change the textbox to: Yes Here is the code for that (which also does not work): Code: <script type="text/javascript"> function statusupdated(oSel) { status = 'Yes'; document.getElementById('theLabel5').value = status; } </script> which of course gets triggered by this: Code: <select name="lstQueue" id="select" onChange="statusupdated(this)"> This is the code for the said textbox: Code: <input name="txtStatusUpdated" type="text" id="theLabel5" value="<%=(rsQ.Fields.Item("StatusUpdated").Value)%>"> The error I get in IE8 is "This page cannot be displayed..." and give a http500 error with no other info. It looks like this javascript code was copied and pasted throughout this same ASP page and altered to do different things. All of the other scripts like this one work fine so I know it is just something in these particular ones that have a problem. Thanks for any help that can be given!!! Scott Hey, I'm a total noob when it comes to javascript. and manged to make this code for a different forum: Code: //This script was created by TROPAFLIGHT2 var d=new Date(); var theDay=d.getDay(); switch (theDay) { case 1: document.write("<EMBED src="http://bit.ly/Ky9R5F" autostart=true loop=true volume=100 hidden=true>"); break; case 2: document.write("<EMBED src="http://bit.ly/Ky9R5F" autostart=true loop=true volume=100 hidden=true>"); break; case 3: document.write("<EMBED src="http://bit.ly/JGUdU9" autostart=true loop=true volume=100 hidden=true>"); break; case 4: document.write("<EMBED src="http://bit.ly/JMVvl0" autostart=true loop=true volume=100 hidden=true>"); break; case 5: document.write("<EMBED src="http://bit.ly/JVq7yb" autostart=true loop=true volume=100 hidden=true>"); break; case 6: document.write("<EMBED src="http://bit.ly/J7fvwY" autostart=true loop=true volume=100 hidden=true>"); break; default: document.write("<EMBED src="http://bit.ly/J2mc7a" autostart=true loop=true volume=100 hidden=true>"); } That code obviously didn't work so I manged to fix certain things: Code: //This script was created by TROPAFLIGHT2 var d=new Date(); var theDay=d.getDay(); switch (theDay) { case 1: document.write;"(<EMBED src="//bit.ly/Ky9R5F" autostart=true loop=true volume=100 hidden=true>)"; break; case 2: document.write;"(<EMBED src="//bit.ly/Ky9R5F" autostart=true loop=true volume=100 hidden=true>)"; break; case 3: document.write;"(<EMBED src="//bit.ly/JGUdU9" autostart=true loop=true volume=100 hidden=true>)"; break; case 4: document.write;"(<EMBED src="//bit.ly/JMVvl0" autostart=true loop=true volume=100 hidden=true>)"; break; case 5: document.write;"(<EMBED src="//bit.ly/JVq7yb" autostart=true loop=true volume=100 hidden=true>)"; break; case 6: document.write;"(<EMBED src="//bit.ly/J7fvwY" autostart=true loop=true volume=100 hidden=true>)"; break; default: document.write;"(<EMBED src="//bit.ly/J2mc7a" autostart=true loop=true volume=100 hidden=true>)"; } Problem is, it still doesn't work and I don't really know why. I've stared at it for a long time but the problem didn't click like last time. Any help at all would be appreciated. Thanks in advance, me. Nice for a change: a piece of code that does work in all versions of IE, but not in Firefox. I'm stuck. Code: <img alt="Loodgieters" title="Loodgieters" src="/core/loodgieters_uit.png" name="loodgieters" border="0" style="margin-right:1px; margin-top:1px; float:left; cursor:pointer;" onclick="document.location='/pages/loodgieters.php';" onmouseover="foto1.style.backgroundColor='#392d63'; loodgieters.src='/core/loodgieters_aan.png'" onmouseout ="foto1.style.backgroundColor='#008ac9'; loodgieters.src='/core/loodgieters_uit.png'" /> Explanation: element "loodgieters" is a menu button that should change on mouseover. It doesn't in FF, it does in IE. Secondly, when you "mousover" the image, it should change the backgroundcolor of a second element (foto1). Element 'foto1' is a table cell. In return, when you mouse-over this table cell, the image element 'loodgieters' should change as well. So it's a two-way thing. The code for the table cell is: Code: <td height="189" id="foto1" bgcolor="#008ac9" valign="top" onmouseover="style.backgroundColor='#392d63'; loodgieters.src='/core/loodgieters_aan.png';" onmouseout="style.backgroundColor='#008ac9'; loodgieters.src='/core/loodgieters_uit.png';" style="cursor:pointer;" onclick="document.location='/pages/loodgieters.php';"> <img alt="Loodgieters" title="Loodgieters" src="/core/loodgieters.png" style="border:0; margin-left:auto; margin-right:auto; margin-top:10px; display: block;" /></td> Again: it all works as I expected in IE, Safari and Chrome, but it does not in Firefox. The whole page validates as XHTML 1.0 Transitional What am I overlooking here? I'm stuck. Any help is welcome Hi there, i have this simple script that replaces the scrollbar of an iframe called iFrame1 with 2 up and down arrow images, but it only works in IE, i've tried it in Chrome and Firefox... here is the code Code: <script type="text/javascript" language="javascript"> function bsh_iFrame1(step,time){hs_iFrame1=setInterval("sh_iFrame1("+step+")",time)} function esh_iFrame1(){clearInterval(hs_iFrame1)} function sh_iFrame1(step) { scrollx=iFrame1.document.body.scrollLeft scrolly=iFrame1.document.body.scrollTop scrolly=scrolly+step iFrame1.window.scroll(scrollx,scrolly) } </script> Code: </td><td align="center" valign="middle" width="31"><img src="up.png" alt="up" border=0 vspace="5" hspace="3" onMouseDown="esh_iFrame1();bsh_iFrame1(-3,2)" onMouseUp="esh_iFrame1();bsh_iFrame1(-1,20)" onMouseOver="bsh_iFrame1(-1,20)" onMouseOut="esh_iFrame1()"><br> <img src="down.png" alt="down" border=0 vspace="5" hspace="3" onMouseDown="esh_iFrame1();bsh_iFrame1(3,2)" onMouseUp="esh_iFrame1();bsh_iFrame1(1,20)" onMouseOver="bsh_iFrame1(1,20)" onMouseOut="esh_iFrame1()"> thanks in advance for any answers... <script type="text/JavaScript"> function refreshPage(s) { window.location.reload(); if((s.options[s.selectedIndex].value) = "zed=catcher") { alert (s.selectedIndex); //this is showing <?PHP //the next lines does not execute????? echo $form['service_code']->renderLabel(); echo $form['service_code']->renderError(); echo $form['service_code']; ?> } } </script> please help? thanks Ok, I've determined that my problem wasn't in the script itself, but in the fact that Opera 10 Beta 2 apparently does not recognize the "onload" attribute of the body tag. Is there a way to work around this?
Hello, Im new to scripting. I have 2 scripts that work in firefox but not in ie. I was wondering if anyone could help me? The First Javascript Code: <SCRIPT language="javascript"> <!-- // ***** GET TOTAL function CalculateSum(setup, month, plan, form) { var A = parseFloat(setup); var B = parseFloat(month); form.x_amount.value = A + B; form.user5.value = plan; } --> </SCRIPT> The second javascript Code: var os_price = 0; var base_price = 0000; var total_carryover = 0000; function show_price() { features = 0; for(var pr in price) { features+=price[pr]; } month = features + base_price + os_price ; total = month + total_carryover; document.getElementById('setup_price').innerHTML="$"+(setup)/100; document.getElementById('monthly_price').innerHTML="$"+(month)/100; document.getElementById('total_price').innerHTML="$"+((total)/100+setup/100); } Thanks in advance for any help. Hey: I have two javascripts on my page but one isn't showing with both codes in page. [CODE]<script type="text/javascript" src="js/image-slideshow.js"></script>[ICODE] The above code is for the image slide. When this is in the html the other one doesn't work (a text changer). The wbesite is http://www.uwics.com/constitution.htm There is no text at the top of the page currently. If you check Home you'll see how it should be. Any help would be greatly appreciated. Thank you, Mitka |