JQuery FadeTo - как использовать

Сначала я хочу сказать, что я новичок в обучении jQuery, и я пытаюсь создать слайд-шоу, используя его.

Вот jQuery:

$(document).ready(function() {
    $("#Slider li img").click(function() {
        $("").fadeTo('slow',0);
        $('#mainImg').attr('src',$(this).attr('src').replace('thumb/', ''));
    });

    var imgSwap = [];
    $("#Slider li img").each(function() {
        imgUrl = this.src.replace('thumb/', '');
        imgSwap.push(imgUrl);
    });
    $(imgSwap).preload();
});

$.fn.preload = function() {
    this.each( function() { $('<img/>')[0].src = this; }); 
}

И мои divs:

<div id="Slider"> 
    <img src="sliderImg/img_1.png" alt="" id="mainImg" />
    <ul>
        <li><img src="sliderImg/thumb/img_1.png" alt="" /></li>
        <li><img src="sliderImg/thumb/img_2.png" alt="" /></li>
        <li><img src="sliderImg/thumb/img_3.png" alt="" /></li>
        <li><img src="sliderImg/thumb/img_4.png" alt="" /></li>
        <li><img src="sliderImg/thumb/img_5.png" alt="" /></li>
        <li><img src="sliderImg/thumb/img_6.png" alt="" /></li>
        <li><img src="sliderImg/thumb/img_7.png" alt="" /></li>
        <li><img src="sliderImg/thumb/img_8.png" alt="" /></li>
        <li><img src="sliderImg/thumb/img_9.png" alt="" /></li>
    </ul>
</div>

Я хочу сделать переходы между изображениями.
Как я могу это сделать? Я попытался использовать fadeTo() но я не смог добиться успеха.

Спасибо за помощь