Syntax error help

Hi,

I have a web page that has a javascript/jquiry slideshow on it. I want to put the code on an external js page so that if I make changes down the road, I don’t have to do it to every page (currently the script is on each page).

Here is the current html code on the web page (I highlighted the js script I want to move in green):



<!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>Oaknoll - An Adult Retirement Community</title>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="Keywords"
 content="oaknoll, iowa city, retirement, elderly, iowa, LifeCare, retirement community, nursing home, apartment, independent living, resident, geriatric, aging, community, retire, retired, elder,  health care, assisted living, nursing care">
<meta name="Description"
 content="Oaknoll is an adult retirement community in Iowa City, Iowa.">
<meta name="robots" content="index,follow">



[COLOR="#2F4F4F"]<!-- include Cycle plugin -->

<!-- include jQuery library -->
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script>
<!-- include Cycle plugin -->
<script type="text/javascript" src="http://cloud.github.com/downloads/malsup/cycle/jquery.cycle.all.latest.js"></script>
<script type="text/javascript">
$(document).ready(function() {
    $('.slideshow').cycle({
		fx: 'fade' // choose your transition type, ex: fade, scrollUp, shuffle, etc...
	    	
			});



$('#s3').cycle({
    fx:    'fade',
	
    speed:  8500,
	
	cleartype: 1,
cleartypeNoBg: false,
height: 'auto',
containerResize: 0,

timeout: 2000,

sync: 0,

fadeOut:'slow',



nowrap: 0,
randomizeEffects: 0,
pause: 2
	


});
	
	
	


});
</script>[/COLOR]


 <!--Vertical Slider Navigation javascript - code on external page-->

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

 <!--endofVerticalSliderNavigationjavascript-->


		

<!--tocorrecttheunsightlyFlashofUnstyledContenthttp://www.bluerobot.com/web/css/fouc.asp-->
	<script type="text/javascript"> </script>
	

	

<!--[if lt IE 7]>
<link rel="stylesheet" type="text/css" href="ie6.css" />
<![endif]-->


<link rel="stylesheet" href="css/floating_index.css" type="text/css" />
<link rel="stylesheet" href="css/nav_css.css" type="text/css" />

</head>

<body>

<div id="container">

<!--#include virtual="includes/header_asp.asp"-->
		



		<div id="main">


        <div id="box1">
       <div class="slideshow">
		
	
    <img src="images/sls/building.jpg" width="400" height="300" alt="Oaknoll Entrance" class="first" />



       </div> <!--end-of-slideshow-->
        </div><!--end-box-1-->

        <div id="box2">
   	  <div class="buttonbox"><img src="images/4_special_buttons.jpg" alt="internet buttons" width="181" height="300" border="0" usemap="#Map" />
        <map name="Map" id="Map">
          <area shape="rect" coords="14,8,178,70" href="http://www.touchtown.tv/tv/tv/webshow/tv1.jsp?tag=OAKNOLL_WEB" target="_blank" alt="Link to Oaknoll Announcements" border="none" />
          <area shape="rect" coords="14,86,177,145" href="http://www.facebook.com/Oaknoll?ref=sgm" target="_blank" alt="Link to Oaknoll's Facebook Page" border="none"/>
          <area shape="rect" coords="16,161,172,213" href="http://oaknoll.blogspot.com/" target="_blank" alt="Link to the Oaknoll Blog" />
          <area shape="rect" coords="18,233,175,297" href="hawkeye.asp" alt="Link to Golden Hawkeye Birthday Club" />
        </map>
   	  </div><!--BUTTONBOX-->
        </div><!--end-box-2-->



   <h1 style="clear:left;">Services/Banking...</h1>
   <p>     Local banks Midwest One, Hills and US Bank, each come to Oaknoll  twice a month and set up a temporary office in our third floor lounge, so our  residents can conveniently take care of basic banking needs.</p>
<p>&nbsp;</p>


</div>

<!--#include virtual="includes/menu_asp.asp"-->

<!--#include virtual="includes/footer_asp.asp"-->




  </div><!--end-of-main-->
</div><!--end-of-container-->
</body>
</html>


When I create the new external .js page and copy that same code to it. I get a message that says:

“There is a syntax error on line 10. Code hinting may not work until you fix this error”. I highlighted line 10 in green.

Here is the code from the external js page:


// JavaScript Document

<!-- include Cycle plugin -->

<!-- include jQuery library -->

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script>

<!-- include Cycle plugin -->

[COLOR="#2F4F4F"]<script type="text/javascript" src="http://cloud.github.com/downloads/malsup/cycle/jquery.cycle.all.latest.js">

</script>[/COLOR]

<script type="text/javascript">
$(document).ready(function() {
    $('.slideshow').cycle({
		fx: 'fade' // choose your transition type, ex: fade, scrollUp, shuffle, etc...
	    	
			});


$('#s3').cycle({
    fx:    'fade',
    speed:  5500,
	cleartype: 1,
cleartypeNoBg: false,
height: 'auto',
containerResize: 0,

timeout: 8000,

sync: 0,

fadeOut:'slow',



nowrap: 0,
randomizeEffects: 0,
pause: 0
	
	
 });

});
</script>


I am not really familiar with js or jquiry. I cut and paste this into my code. I have no idea what the error is.

Any thoughts???

Thanks,
Sarahb

You cannot have HTML comments in a .js file.

You also cannot have HTML elements or HTML content in an external script file. The external script file is only for scripts.