Welcome to WebmasterWorld Guest from 54.198.43.125

Forum Moderators: open

Message Too Old, No Replies

Placing JS in a separate file

My script no longer works once it's removed to a separate file

     
12:57 pm on Jul 8, 2005 (gmt 0)

New User

10+ Year Member

joined:Feb 25, 2005
posts:31
votes: 0


I've seen the below used to avoid large blocks of js at the top of a page:

<SCRIPT type="text/javascript" src="javascript.js"></SCRIPT>

Where the script is dumped into the(imaginitively titled) 'javascript.js' file in my root folder, which reads thusly:

// JavaScript Document
<script language="JavaScript" type="text/JavaScript">
<!--
-----blah blah blah----
//-->
</script>

However, this doesn't appear to work. Please, is there any chance someone can point out what i've messed up?

1:21 pm on July 8, 2005 (gmt 0)

Administrator

WebmasterWorld Administrator coopster is a WebmasterWorld Top Contributor of All Time 10+ Year Member

joined:July 31, 2003
posts:12541
votes: 1


Hi kate theisinger, welcome to WebmasterWorld.

Is your HTML document in the root folder too? If not, you might want to modify the path, notice the slash:

src="/javascript.js"
1:32 pm on July 8, 2005 (gmt 0)

Preferred Member

10+ Year Member

joined:July 5, 2005
posts:352
votes: 0


You do not need to specify
<script language="JavaScript" type="text/JavaScript">

inside a .Js file.

Just add your Js directly

// some funciton
function(){
alert('Hello world!');
}

2:09 pm on July 8, 2005 (gmt 0)

New User

10+ Year Member

joined:Feb 25, 2005
posts:31
votes: 0


Hi, thanks for the responses...

Yep, both files are in the same folder.

And sadly it doesn't work any better even if i remove the <script language="JavaScript" type="text/JavaScript">.

I think it must be to do with me not really knowing one end of js from the other - i've moved the section which is obvious, ie :
// some funciton
function(){
alert('Hello world!');

But i've also got some image swaps inside my div tags:

<div id="Abstract" style="position:absolute; left:559px; top:155px; width:97px; height:134px; z-index:10"><a href="abstract.htm" onmouseover="MM_swapImage('Bigcat','','Images/Abstract1.jpg',1)" onmouseout="MM_swapImgRestore()"><img src="Images/Abstract1thumb.jpg" width="97" height="134" border="0" /></a></div>

Is there a way to extricate my js from my css?

3:19 pm on July 8, 2005 (gmt 0)

Senior Member

WebmasterWorld Senior Member 10+ Year Member

joined:Mar 30, 2004
posts:712
votes: 0


Sorry, misread first post.
10:30 pm on July 8, 2005 (gmt 0)

Senior Member

WebmasterWorld Senior Member rocknbil is a WebmasterWorld Top Contributor of All Time 10+ Year Member

joined:Nov 28, 2004
posts:7999
votes: 0


-----blah blah blah----

What the above represents is VERY important to know, I think you may need to paste the external file contents to figure out what's broken.

MM_swapImage

Editing Dreamweaver code - you must tread cautiously here, this convoluted auto-generated stuff can be very tricky for someone new at JS. IMO it's also next to worthless, but again, IMO.

To get you started, put this:
alert('hello');

. . . at the top of your external file. If you get the alert, it's reading the file and the problem is in your JS. If you don't get the alert, there is a path file issue or something, the page is not **actually** including the Javascript when it loads.

3:58 pm on July 19, 2005 (gmt 0)

New User

10+ Year Member

joined:Feb 25, 2005
posts:31
votes: 0


Just to check, is this

alert('hello');

sufficient to trigger the alert, or is that only part of the script? That alone isn't working, but as i'm not familiar with the function i'm still not sure whether that leaves me with a js problem or a file path thing.

Just re-read the TOS, so i *think* i'm allowed to post....
Example of the js in my external file:

function MM_reloadPage(init) { //reloads the window if Nav4 resized
if (init==true) with (navigator) {if ((appName=="Netscape")&&(parseInt(appVersion)==4)) {
document.MM_pgW=innerWidth; document.MM_pgH=innerHeight; onresize=MM_reloadPage; }}
else if (innerWidth!=document.MM_pgW innerHeight!=document.MM_pgH) location.reload();
}
MM_reloadPage(true);

Example of stuff which remains within my html file:

<div id="Wildlife" style="position:absolute; left:445px; top:154px; width:112px; height:134px; z-index:9"><a href="wildlife.htm" onmouseover="MM_swapImage('Bigcat','','Images/wildlife1.jpg',1)" onmouseout="MM_swapImgRestore()"><img src="Images/wildlife1thumb.jpg" width="112" height="134" border="0" /></a></div>

Does this shed any light?
Can i separate the js from the CSS? - can i export it all into an external file, or am i just hopelessly out of my depth? :(

10:20 pm on July 20, 2005 (gmt 0)

Administrator

WebmasterWorld Administrator coopster is a WebmasterWorld Top Contributor of All Time 10+ Year Member

joined:July 31, 2003
posts:12541
votes: 1


Here is a quick example of how to determine whether or not your path is correct. Create two files, the first is the html:

<html> 
<head>
<title>JavaScript Test</title>
<script type="text/javascript" src="javascript.js"></script>
</head>
<body>
<p>JavaScript Test: You should have seen a pop-up window saying Hello!</p>
</body>
</html>

Now, in the same directory, create an external JavaScript file named "javascript.js" and all it has to contain is the following line:

alert('Hello!');

Now open your browser and call up the html document you created. A pop-up window should appear saying 'Hello!' and you can click the OK button to continue (that is what an "Alert" function does).

If you get that to work, then you can begin moving your external javascript file to a different directory and work on changing the path in the "src" attribute of your <script> tag. Make sense?

3:41 pm on July 21, 2005 (gmt 0)

New User

10+ Year Member

joined:Feb 25, 2005
posts:31
votes: 0


*Thank you*... that makes perfect sense.

At least I can now safely say its not a file path issue.

Is there anything else i should check to find out why the image swaps aren't working?

3:51 pm on July 21, 2005 (gmt 0)

Senior Member

WebmasterWorld Senior Member 10+ Year Member

joined:Oct 3, 2003
posts:792
votes: 0


In the example div and image tags you posted, your image tag doesn't have an id attribute. (If this code triggering an image swap on a different image, then that would be okay) The swapimage function is looking for an image with id='Bigcat'.
 

Join The Conversation

Moderators and Top Contributors

Hot Threads This Week

Featured Threads

Free SEO Tools

Hire Expert Members