Error con fragmento Javascript y CGI

[tenisentierra]

Hola a todos,

Estoy haciendo una web, la cual lleva un pequeño slider. Dicha web se genera a traves de un CGI hech en delphi. EL slider llama a un fichero js que tiene el siguiente código:


/*
* Variables
*/

var slides, timer;

//Crea un objeto con información de los slides
slides = $('#slider .slidesContainer > .slide');


/*
* Funciones
*/

//Desplaza el contenedor hacia la dirección definida
//@direction = [left,right]
function sliderScroll(direction){

//Calcula la posición actual del contenedor
position = $('#slider').scrollLeft();

//Calcula la anchura total menos el último slide.
//Se usa para calcular cuando el scroll llega al final.
totalWidth = (slides.length * slides[0].offsetWidth) - slides[0].offsetWidth

//Se comprueba la variable direction para hacer el scroll hacia izquierda o derecha
switch (direction) {
case 'right': //Derecha
if (position+slides[0].offsetWidth > totalWidth){ //Si la siguiente posición se sale del contenedor, vuelve al principio.
$('#slider:not(:animated)').animate({scrollLeft:0} ,1000);
} else { //Si no es el final, suma a la posición actual la anchura del slide.
$('#slider:not(:animated)').animate({scrollLeft:po sition+slides[0].offsetWidth},1000);
}
break;

case 'left': //Izquierda
if (position-slides[0].offsetWidth < 0){ //Si la siguiente posición se sale del contenedor, vuelve al final.
$('#slider:not(:animated)').animate({scrollLeft:to talWidth},1000);
} else { //Si no es el final, resta a la posición actual la anchura del slide.
$('#slider:not(:animated)').animate({scrollLeft:po sition-slides[0].offsetWidth},1000);
}
break;
}

}

//Función que crea el temporizador
function initTimer(){
timer = setInterval(function(){sliderScroll('right');}, 10000);
}


/*
* Código
*/

//Asigna el ancho total de los slides al contenedor
//La anchura total se obtiene multiplicando la medida de un slide por el número de slides)
$('#slider .slidesContainer').css('width',slides[0].offsetWidth * slides.length);


//Click en el botón "next"
$('.next').click(function(){
clearInterval(timer); //Desactiva el temporizador
sliderScroll('right'); //Mueve el scroll a la derecha
initTimer(); //Vuelve a activar el temporizador
return false;
});

//Click en el botón "prev"
$('.prev').click(function(){
clearInterval(timer); //Desactiva el temporizador
sliderScroll('left'); //Mueve el scroll a la izquierda
initTimer(); //Vuelve a activar el temporizador
return false;
});

//Inicia el temporizador
initTimer();

});

Tengo que comentar que dicho codigo js NO es mío, ya que yo deconozco dicho lengauje.

EL tema es que si llamo a mi web de forma normal (sin generar la pagina mediante un CGI que lee en una base de datos), la web se carga de forma normal y se ve todo perfectamente, PERO, si cargo la web mediante mi CGI cargando los datos de la base de datos, el fichero js me da problemas y no se ejecuta correctamente, y me da error :

$ is not definid refieriendose a la primera línea del codigo js que os he pegado.

¿Alguien sabe como puedo solucionarlo?

Mucha gracias.