Creating external file.js for Cool DHTML Tooltip

[KenCRoy]

1) Script Title: Cool DHTML Tooltip

2) Script URL (on DD): http://dynamicdrive.com/dynamicindex5/dhtmltooltip.htm

3) Describe problem: When I try to create an external javascript file for the script in Step 2 (minus the <div statement) which I include in my page, the script does not work.

Firebug extension to FireFox 2.0 reports a syntax error on line 18 which is

return (document.compatMode && document.compatMode!="BackCompat")? document.documentElement : document.element.body

in the external ddrivetip.js file that I created. Unfortunately, I don't know enough javascript code to fix the error.

Page that currently contains the inline script is my Vietnam Map at http://www.royandboucher.com/genealo...es/vietnam.php

Doctype for the page is XHTML 1.0 Transitional.

External script does not work in multiple browsers, but Firebug extension is only on FireFox 2.0

Any help of fixing the syntax error would be appreciated, since I would like to have an external script file that can be called from various pages.

Thanks in Advance.

Ken

[jscheuer1]

Please post a link to the page on your site that contains the problematic code so we can check it out.

To find and fix an error, we need to see the page that is not working. Here are some guidelines to avoiding common errors when making a javascript external:

Use a text editor to save the script, call it 'file_name.js' where 'file_name' can be any valid file name of your choosing. Substitute the name of your external .js file for some.js in the below:

<script src="some.js" type="text/javascript"></script>

Common problems arise when:

1 ) The script file is not in the directory specified. In the above example it must be in the same directory as the page(s) that use it. Below, it can be in the scripts directory off of the root of a domain:

<script src="http://www.somedomain.com/scripts/some.js" type="text/javascript"></script>

2 ) Opening, closing and/or 'hiding' tags are left in the external file. This means that you must strip:

<script>
<!--

and

//-->
</script>

and any of their many variations from the beginning and end of the external file.

3 ) The external call (<script src="some.js" type="text/javascript"></script>) is not inserted into the page at the correct spot. The external call must be inserted at the same place on the page where the script was/would have been.

4 ) Paths to other files (if) used by the script are no longer valid due to its location. This is only a problem if the external script is kept in a different directory than the page it was working on when it was an internal script. To correct this, use absolute paths inside the script. Absolute path examples:

http://www.somedomain.com/images/button.gif

http://www.somedomain.com/~mysitename/index.html

5 ) Inappropriately combining two or more scripts into one external file. Usually external scripts can be combined if one knows enough about scripting to do so properly. Even then it is possible to overlook something.

A rule of thumb when testing is, if it won't work on the page, it won't work as an external file either.

One other thing, if this is a DD script or any script that requires the credit remain for legal use, include the credit in the on page call, ex:

<script src="some.js" type="text/javascript">
/***********************************************
* IFrame SSI script II- © Dynamic Drive DHTML code library (http://www.dynamicdrive.com)
* Visit DynamicDrive.com for hundreds of original DHTML scripts
* This notice must stay intact for legal use
***********************************************/
</script>

Make sure to retain all the 'decorations', as these include begin and end javascript comment delimiters, without which the script won't function.

There is also info here:

http://www.javascriptkit.com/javatutors/external.shtml

[KenCRoy]

John,

Thanks so much for your reply. My problem in creating as an external ddrivetip.js was No 2 in your list of errors, where I had left the <script> and </script> statement in the external file.

The Cool DHTML Tooltip is now running as an external ddrivetip.js on my Military Ancestor page http://www.royandboucher.com/veterans/ancestors.php
and my Vietnam Map page http://www.royandboucher.com/genealo...es/vietnam.php

and replaces a previous popup script that was not working in Safari.

So thanks again for your help. This is a really cool tooltip script.

BTW, I also added a direct link to the actual script in the credits flower box which must be coded as

<!--
/***********************************************
* Cool DHTML tooltip script- © Dynamic Drive DHTML code library (www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit Dynamic Drive at http://www.dynamicdrive.com/ for full source code
* Cool DHTML Tooltip at http://dynamicdrive.com/dynamicindex5/dhtmltooltip.htm 
***********************************************/
-->

within the HTML page

[jscheuer1]

If you do it like so (with the closing script tag after the credit):

<script type="text/javascript" language="JavaScript" SRC="../../../../script/ddrivetip.js"> 
<!--
/***********************************************
* Cool DHTML tooltip script- © Dynamic Drive DHTML code library (www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit Dynamic Drive at http://www.dynamicdrive.com/ for full source code
* Cool DHTML Tooltip at http://dynamicdrive.com/dynamicindex5/dhtmltooltip.htm 
***********************************************/
// -->
</script>

You don't really need the HTML comment tags, though they are still a good idea. And if you do use them, be sure to include the two red javascript comment tokens as well.

But what you have is fine. BTW, if you are no longer using:

<script type="text/javascript" language="JavaScript" SRC="../../../script/popup.js"></script>

You might as well get rid of it.

The language attribute:

language="JavaScript"

has been deprecated, and isn't required, best not to use it.

[KenCRoy]

John,

Thanks again for your comments. Without the <!-- and --> comments, the information was being displayed on the page.

I will remove the obsolete script call, which is the one I am in the process of replacing since it does not work in Safari (both on the Mac and on Windows XP)

Ken