problème sur slider

bonsoir,
Voilà j'ai essayé de reproduire la mise en place d'un slider jquery avec bouton de navigation, mais il de fonctionne pas correctement.En autoplay pas de soucis mais les bouton de navigation prev et next me renvoient sur ma page d'accueil. voici le code html et le script utilisé:
[code]<div id="slider">
<a href="#" class="control_next">>></a>
<a href="#" class="control_prev"><</a>
<ul>
<li><img src="http://lorempixel.com/900/550/sports" /></li>
<li><img src="http://lorempixel.com/900/550/nature" /></li>
<li><img src="http://lorempixel.com/900/550/abstract" /></li>
<li><img src="http://lorempixel.com/900/550/people" /></li>
</ul>
</div>
<div class="slider_option">
<input type="checkbox" id="checkbox">
<label for="checkbox">Autoplay Slider</label>
</div> [/code]

et javascript :
[code]jQuery(document).ready(function ($) {

$('#checkbox').change(function(){
setInterval(function () {
moveRight();
}, 5000);
});

var slideCount = $('#slider ul li').length;
var slideWidth = $('#slider ul li').width();
var slideHeight = $('#slider ul li').height();
var sliderUlWidth = slideCount * slideWidth;

$('#slider').css({ width: slideWidth, height: slideHeight });

$('#slider ul').css({ width: sliderUlWidth, marginLeft: - slideWidth });

$('#slider ul li:last-child').prependTo('#slider ul');

function moveLeft() {
    $('#slider ul').animate({
        left: + slideWidth
    }, 1000, function () {
        $('#slider ul li:last-child').prependTo('#slider ul');
        $('#slider ul').css('left', '');
    });
};

function moveRight() {
    $('#slider ul').animate({
        left: - slideWidth
    }, 1000, function () {
        $('#slider ul li:first-child').appendTo('#slider ul');
        $('#slider ul').css('left', '');
    });
};

$('a.control_prev').click(function () {
    moveLeft();
});

$('a.control_next').click(function () {
    moveRight();
});

}); [/code]

merci