Script Problems with "src" tags
I have a script embedded in a page that looks like this:
<script type="text/javascript">
function fireNlPopup()
{
setOpacity(0);
centre();
document.getElementById("NlPopup").style.display = "block";
fadeInNlPopup();
}
//Other functions here
</script>
this means the following is displayed as the popup:
<div id='NlPopup' name='NlPopup' class='nl'>
<table width='380' cellpadding='0' cellspacing='0' border='0'>
<tr>
<td><img height='23' width='356' src='images/x11_title.gif'></td>
<td><a href='javascript:fadeOutNlPopup();'><img height='23' width='24' src='images/x11_close.gif' border='0'></a></td>
</tr>
<tr><td colspan='2' style='background: url("images/x11_body.gif") no-repeat top left; width: 380px; height: 277px;'>
Your next lecture is X, with Y, at Z.
</td></tr>
</table>
</div>
and finally it's all called a button:
<button type="button" style="button" onClick="fireNlPopup()">Next Lecture</button>
The problem is I am trying to install the script to a different file. I have a file called popup.js with the same code (since it works when it is embedded in my php file, I assumed that if I copied it into a js file and called this it would work.
When I call the js file, I use:
<script type="text/javascript" src="popup.js">
</script>
and then all content between script tags goes to popup.js. However, even though the code works fine when inline, the second I take it out and put it in my own file, it doesn't work. I checked double and triple, my code is working fine, syntax is correct and so I left it in the code snippet. for some reason it just stops working. Am I calling the file incorrectly? This is on my server, I checked this too = P
I'm probably really stupid, but any help would be really helpful. I've been stuck on this for ages.
Thank you =)
EDIT: For anyone wanting to take a look, the page is live here: http://oliverlea.com/3yp/tt.php
Also, using Chrome to view the source, the file is downloaded as a link.
Thanks for the help =)
EDIT 2:
First, the yep script tag is at the beginning of my file.
Second: Ok, so no matter if I use src = "popup.js" "/popup.js" or "./popup.js" I get nothing. The url is always loaded in Chrome viewer and even changing the file permissions to 0755 it still doesn't matter.
I am totally confused about this.
source to share
This is a problem with the encoding of the popup.js file. Below is my analysis. Some browsers "fix" this for you, while others don't. The solution is to save the popup.js file in standard encoding, on a Windows machine try saving in Notepad.
EDIT: Added summary (above). A complete analysis of your problem is below:
Your page works in IE9 but not Chrome or Firefox. Also, I copied the page and your CSS and JS (but not images) to a local project and it works for me there too (even in chrome and Firefox).
Then I loaded your live page into FireFox and opened FireBug, and when I clicked Next Lecture, the console showed me that FireNlPopup is undefined.
In the course of further browsing, I went to look at the source in FireFox on your live page and clicked "popup.js". The result looked like this:
It looks like you are using some kind of text editor to create your popup.js file, which is encoded in a strange format; use standard Notepad or Notepad ++ (i.e. not Wordpad) or use Eclipse or Visual Studio to save the popup.js file and you should be good.
source to share
I had a different reason but the same symptoms. Basically, I didn't connect to the script file on the server, it requires an addition to the routing table to get it. A bit nondescript, but I can save some time.
FWIW, I added (using node.js);
// script routes
app.get('/scripts/:script', script_server.serve);
and in script_server.js
exports.serve = function(req, res){
res.sendfile(req.param('script'));
};
source to share