I found script for drop down content that I very much like but I'm getting Invalid Errors. Could someone please take a look at it and explain how to make it valid?

What it does can be viewed here:
http://triplemoonsdesign.com/services.html

Javascript

<script type="text/javascript">            
    var slideDownInitHeight = new Array();
    var slidedown_direction = new Array();

    var slidedownActive = false;
    var contentHeight = false;
    var slidedownSpeed = 3;     // Higher value = faster script
    var slidedownTimer = 7;    // Lower value = faster script
    function slidedown_showHide(boxId)
    {
        if(!slidedown_direction[boxId])slidedown_direction[boxId] = 1;
        if(!slideDownInitHeight[boxId])slideDownInitHeight[boxId] = 0;
        
        if(slideDownInitHeight[boxId]==0)slidedown_direction[boxId]=slidedownSpeed; else slidedown_direction[boxId] = slidedownSpeed*-1;
        
        slidedownContentBox = document.getElementById(boxId);
        var subDivs = slidedownContentBox.getElementsByTagName('DIV');
        for(var no=0;no<subDivs.length;no++){
            if(subDivs[no].className=='dhtmlgoodies_content')slidedownContent = subDivs[no];    
        }

        contentHeight = slidedownContent.offsetHeight;
    
        slidedownContentBox.style.visibility='visible';
        slidedownActive = true;
        slidedown_showHide_start(slidedownContentBox,slidedownContent);
    }
    function slidedown_showHide_start(slidedownContentBox,slidedownContent)
    {

        if(!slidedownActive)return;
        slideDownInitHeight[slidedownContentBox.id] = slideDownInitHeight[slidedownContentBox.id]/1 + slidedown_direction[slidedownContentBox.id];
        if(slideDownInitHeight[slidedownContentBox.id] <= 0){
            slidedownActive = false;    
            slidedownContentBox.style.visibility='hidden';
            slideDownInitHeight[slidedownContentBox.id] = 0;
        }
        if(slideDownInitHeight[slidedownContentBox.id]>contentHeight){
            slidedownActive = false;    
        }
        slidedownContentBox.style.height = slideDownInitHeight[slidedownContentBox.id] + 'px';
        slidedownContent.style.top = slideDownInitHeight[slidedownContentBox.id] - contentHeight + 'px';

        setTimeout('slidedown_showHide_start(document.getElementById("' + slidedownContentBox.id + '"),document.getElementById("' + slidedownContent.id + '"))',slidedownTimer);    // Choose a lower value than 10 to make the script move faster
    }
    
    function setSlideDownSpeed(newSpeed)
    {
        slidedownSpeed = newSpeed;
        
    }
    </script>

HTML

<div id="dhtmlgoodies_control">&bull; <a href="#" onclick="slidedown_showHide('box1');return false;">Content Management</a></div>
    <div class="dhtmlgoodies_contentBox" id="box1">
        <div class="dhtmlgoodies_content" id="subBox1">
            <!-- slide down content goes here -->
            Content management is a database driven system that allows users to update information on a web site via an administrative panel. No knowledge of HTML or CSS is required to make changes to pages connected to a CMS. For more information, please <a href="http://www.triplemoonsdesign.com/blog" target="_blank">see our blog</a>.
            <!-- End slide down content -->
        </div>
    </div>
</div>

CSS

.dhtmlgoodies_contentBox{
        border:2px solid #ED1878;
        height:0px;
        visibility:hidden;
        position:absolute;
        background-color:#666666;
        overflow:hidden;
        padding: 0px 5px 5px 5px;
        width:300px;
                
}
.dhtmlgoodies_content{
        position:relative;        
        font-family: "Century Gothic", Futura, Arial;
        width:100%;
        font-size:12px;
        text-align: justify;
        
}

Since the site you link to doesn't throw any errors in FF, I'll assume you've got this fixed and just forgot to tell us. If not, then please give more details on the error.

Script seems to be working OK.

Constructive criticism - could do with a refresher on HTML and CSS.

Are you really quoting from Wikipedia.

Originally Posted by JeremyMiller

Since the site you link to doesn't throw any errors in FF, I'll assume you've got this fixed and just forgot to tell us. If not, then please give more details on the error.

The invalid errors can be seen here. Their are seven. Not too sure why you aren't seeing the errors.

(Just jumping in - hope OK...)

The validator is interpreting your JS as HTML and, not surprisingly, it's not very happy about that. I'm not sure if that's the way it should work (anyone know?), and certainly no browser made in the past 10 or so years would make that mistake, but sticking comment tags around the script (as with the first one) - or better putting the scripts in an external file - will probably solve the issue.

I like the idea of putting it into an external file. Less code in the HTML.

How do I go about doing that and making it work? I put the Javascript into its own file called dropdowncontent.js and linked it to the HTML file this way:

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

However it doesn't seem to be working. I don't think it's reading the CSS file?

It works fine for me, locally at least. Is it reading the JS file? (e.g. if you stick an alert("hi"); at the beginning of the file, does it stick up a box?)

You can see here that it's not working.

These are the Firebug errors:

syntax error
UIUpdate()UIUpdate.js (line 30)

[IMG]chrome://firebug/content/blank.gif[/IMG] if(!slidedown_direction[boxId])slidedown_direction[boxId] = 1;\

slidedown_showHide is not defined
onclick(click clientX=0, clientY=0)

You don't need this <script type="text/javascript"> in an external script file.

<script src="dropdowncontent.js">
</script>

Created three Firebug errors and doesn't work.

What meloncholy is saying is you should NOT have the "<script type= ...>" delimiter tags actually IN the external file.

the "type" attribute HAS to be on the declaration of the external file though.

Oooooooooo. I didn't even realize I'd stuck it in the .js file!
Thanks! That worked perfectly!