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.
