diaporama avec javascript
Bonsoir,
à travers le web j'ai réussi à prendre le code source pour la réalisation d'un diaporama.
Cependant, j'ai un petit problème, en effet, il n'y a que le défilement automatique qui m'intéresse et non et le défilement manuel.
Dans ce code, il intègre les deux...j'ai essayé par les connaissances que j'ai acquises en cours de les éliminer mais je n'y arrive pas.
Voici le lien de la page d'accueil de mon site:http://pixel-edition.fr/accueil.html
Vous pouvez remarquer qu'il y a la présence de "prec., pause, suiv.":
Le code javascript où je pense pouvoir éliminer le problème:
Code:
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
|
(function($){
$.fn.diaporama = function(options) {
var defaults = {
delay: 3,
animationSpeed: "normal",
controls:true
};
var options = $.extend(defaults, options);
this.each(function(){
var obj = $(this);
if($(obj).find("li").length > 1){
var inter = setInterval(function(){nextElt(options)}, (options.delay*1000));
var sens = "right";
var pause = false;
$(obj).find("li").hide();
$(obj).find("li:first-child").addClass("active").fadeIn(options.animationSpeed);
// Controls
if(options.controls)
{
$(obj).after("<div class='diaporama_controls'><div class='btns'><a href='#' class='prev'>Prec.</a> <a href='#' class='pause'>Pause</a> <a href='#' class='next'>Suiv.</a></div></div>");
$(obj).siblings().find(".prev").click(function(){
clearInterval(inter);
prevElt(options);
if(!pause)
inter = setInterval(function(){prevElt(options)}, (options.delay*1000));
sens = "left";
});
$(obj).siblings().find(".next").click(function(){
clearInterval(inter);
nextElt(options);
if(!pause)
inter = setInterval(function(){nextElt(options)}, (options.delay*1000));
sens = "right";
});
$(obj).siblings().find(".pause").toggle(
function(){
$(this).removeClass("pause").addClass("play");
clearInterval(inter);
pause = true;
},
function(){
$(this).removeClass("play").addClass("pause");
inter = setInterval(function(){ (sens == "right")?nextElt(options):prevElt(options)}, (options.delay*1000));
pause = false;
}
);
}
// Affiche l'élément suivant
function nextElt(options)
{
$(obj).find("li.active").fadeOut(options.animationSpeed);
if(!$(obj).find("li.active").is(":last-child"))
{
$(obj).find("li.active").next().addClass("active").prev().removeClass("active");
$(obj).find("li.active").fadeIn(options.animationSpeed);
}
else
{
$(obj).find("li:first-child").addClass("active").fadeIn(options.animationSpeed);
$(obj).find("li:last-child").removeClass("active");
}
}
// Affiche l'élément précédent
function prevElt(options)
{
$(obj).find("li.active").fadeOut(options.animationSpeed);
if(!$(obj).find("li.active").is(":first-child"))
{
$(obj).find("li.active").prev().addClass("active").next().removeClass("active");
$(obj).find("li.active").fadeIn(options.animationSpeed);
}
else
{
$(obj).find("li:last-child").addClass("active").fadeIn(options.animationSpeed);
$(obj).find("li:first-child").removeClass("active");
}
}
}
});
return this;
};
})(jQuery); |
Est-ce possible d'éliminer le défilement automatique?
Merci d'avance.
Cordialement,
Serpolet.
