Bonjour, je suis débutant en javascript et je tente d'apprendre et de m'en sortir avec mes bouquins mais la je cale depuis trois semaine sur un petit problème que peut être vous pourrez m'aider à résoudre !!!

Voilà mon problème j'ai récupérer et modifier un javascript qui me sert pour l'instant à créer mon site et sur ce script il y a une fonction qui permet de passer d'une image à une autre (dans le sens d'insertion html) grâce à une flèche (en image) identifier grâce a son ID qui est "control" et moi je souhaiterait juste modifier cette fonction pour pouvoir placer des boutons (images) qui mèneront eux à des images bien précises (url bien précises) et pas naviguer simplement dans le sens d'insertion xhtml comme le ferais le bouton "next" d'un lecteur CD !!!

J'espère avoir été clair dans mon explications et pas trop vague !!! [cligne]

Je vous joint la partie du code :

Code js :
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
     function initProject(){
    $("#projects #pagination").hide();
 
    extLink = $("#projects #externalLink a:first").attr("href");
    extLinkTitle = $("#projects #externalLink a:first").attr("title");
 
    pages = [];
    $("#projects #pagination a").each(function(){
        var href = this.getAttribute('href');
        pages.push(href);
    })
 
    if (pages.length <= 1){
        $("#projects #pagination").fadeOut();
    }else{
        var width = (pages.length*61) + "px";
        $("#projects #pagination ul").animate({
            width:width
        },1);
        $("#projects #pagination").fadeIn("slow");
    }
 
    loadImgs();
 
    $("#projects #description").animate({
        opacity:1
    },{duration: 500, easing: "easeInOutQuint"}); 
 
    setTimeout(function(){
        $("#control a").animate({
            opacity:1,
            left:"48px"
        },{duration: 400, easing: "easeInOutQuint"});
        $("#project").attr("left","0px").animate({
            opacity:1,        
        },{duration: 300, easing: "easeInOutQuint"});
    },400);
 
    updateHash(curProject);
}
 
function switchImg(index){
    var position = index*512*-1;
 
    switchDot(index);
    $("#imgContainer").animate({
        opacity:0
    },{duration: 280, easing: "easeInOutQuint"}).animate({
        top:position
    },1);
    setTimeout(function(){
        $("#imgContainer").animate({
            opacity:1
        },{duration: 500, easing: "easeInOutQuint"}); 
    },300);
}
 
function switchDot(index){
    $("#projects #pagination a:not(:eq("+index+"))").animate({
        opacity:0,
    },{duration: 600, easing: "easeInOutQuint"});
    $("#projects #pagination li:not(:eq("+index+"))").animate({
        backgroundPosition: "0 0"
    },100);
 
    $("#projects #pagination a").eq(index).animate({
        opacity:1,
    },{duration: 800, easing: "easeInOutQuint"});
 
    $("#projects #pagination li").eq(index).animate({
        backgroundPosition: "0 -58px"
    },800);
    curPage = index;
}
 
function loadImgs(){
    if (loadedProjects[curProject] == "0"){
        $("#loader").fadeIn();
    }else{
        $("#loader").hide();
    }
    var loadCount = 1;
 
    for (i=0;i<pages.length;i++){
        var img = new Image();
        $(img).load(function() {
            $("#imgContainer").append(this);
            loadCount++;
            if(loadCount > pages.length){
                $("#imgContainer").animate({
                    opacity:1,
                },{duration: 800, easing: "easeInOutQuint"});
 
                if (extLink){
                    var html = $("#imgContainer").html();
                    newHTML = '<a href="'+extLink+'" title="'+extLinkTitle+'" target="_self">'+html+'</a>';
                    $("#imgContainer").html(newHTML);
                }
                loadedProjects[curProject] = 1;
                switchDot(0);
                setTimeout(function(){$("#loader").fadeOut();},800);
            }
        }).error(function () {
            // notify the user that the image could not be loaded
        }).attr('src', pages[I]);
    }
}
 
function checkHash() {
    if ((window.location.hash != recentHash)) {
        hashChange = true;
        recentHash = window.location.hash;
        var hash = window.location.hash;
        if(hash.match(mark)){
            var splitHash = hash.split(/\?/);
            var section = splitHash[0];
            var item = splitHash[1];
            //directTo(section, item);
            if(section == '#portfolio'){
                path = pathPrefix + item + '.html';
                var projectIndex = jQuery.inArray(path, projects);
                curProject = projectIndex;
                $("#projects").load(path,initProject);
            }
        }
    }else{
        hashChange = false;
    }
}
 
function updateHash(index){
    var path = projects[index];
    path = path.replace(/static\/portfolio_/,'');
    path = path.replace(/.html/,'');
    recentHash =  window.location.hash = '#portfolio?'+path;
}