iCarousel: erreur avec window.addEvent
Salut à tous,
Voilà ça fait maintenant plusieurs heures que je planche sur le problème, que je cherche différentes solutions sur Internet mais rien n'y fait je n'arrive pas à comprendre l'erreur. J'essaie de mettre en place l'exemple 6 de iCarousel, disponible à cette adresse:
http://zendold.lojcomm.com.br/icarousel/example6.asp
Cependant, même en faisant un copier-coller de la page en question, en reprenant les liens relatifs et en les transformant en liens absolus, rien n'y fait.... Je me retrouve donc avec 2 pages ayant exactement la même structure, les mêmes liens vers les mêmes fichiers et pourtant, celle du site fonctionne mais pas la mienne: le défilement lors du clic ne fonctionne tout simplement pas.
La seule différence que l'on pourrait noter et que le fichier sur le site est en ASP et que le miens est purement en html.
Je précise que je suis un néophyte en JavaScript, mais bizarrement la console de débuggage de Firefox m'indique 2 erreurs sur mon fichier, mais ne les indiques étrangement pas sur le site:
Code:
1
2
3
4
5
6
7
| Erreur*: Class is not defined
Fichier Source*: http://zendold.lojcomm.com.br/icarousel/js/iCarousel.js
Ligne*: 2
Erreur*: window.addEvent is not a function
Fichier Source*: file:.........../index2.html#
Ligne*: 26 |
Si quelqu'un pourrait me donner un petit coup de main pour me sortir de ce pétrin je lui en serais très reconnaissant :ccool:
Voici mon code:
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
| <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="UTF-8">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta name="author" content="Fabio Zendhi Nagao" />
<meta name="editor" content="Notepad++" />
<meta name="robots" content="index, follow" />
<meta name="revisit-after" content="15 Days" />
<link rel="stylesheet" type="text/css" href="http://zendold.lojcomm.com.br/icarousel/common/css/reset-fonts.css" />
<title>iCarousel - Simple news ticker</title>
<link type="text/css" rel="stylesheet" href="http://zendold.lojcomm.com.br/icarousel/common/css/zend.css"></link>
<link type="text/css" rel="stylesheet" href="http://zendold.lojcomm.com.br/icarousel/common/css/moodalbox.css" media="screen" />
<link type="text/css" rel="stylesheet" href="http://zendold.lojcomm.com.br/icarousel/common/css/syntaxHighlighter.css"></link>
<link type="text/css" rel="stylesheet" href="http://zendold.lojcomm.com.br/icarousel/common/comments/this.css"></link>
<link type="text/css" rel="stylesheet" href="http://zendold.lojcomm.com.br/icarousel/css/this.css"></link>
<script type="text/javascript" src="http://zendold.lojcomm.com.br/icarousel/common/http://zendold.lojcomm.com.br/icarousel/js/mootools.v1.1.js"></script>
<script type="text/javascript" src="http://zendold.lojcomm.com.br/icarousel/common/http://zendold.lojcomm.com.br/icarousel/js/shCore.js"></script>
<script type="text/javascript" src="http://zendold.lojcomm.com.br/icarousel/common/http://zendold.lojcomm.com.br/icarousel/js/shBrushXml.js"></script>
<script type="text/javascript" src="http://zendold.lojcomm.com.br/icarousel/common/http://zendold.lojcomm.com.br/icarousel/js/shBrushJScript.js"></script>
<script type="text/javascript" src="http://zendold.lojcomm.com.br/icarousel/common/http://zendold.lojcomm.com.br/icarousel/js/shBrushCss.js"></script>
<script type="text/javascript" src="http://zendold.lojcomm.com.br/icarousel/js/iCarousel.js"></script>
<script type="text/javascript">
window.addEvent("domready", function() {
var ex6Carousel = new iCarousel("example_6_content", {
idPrevious: "example_6_previous",
idNext: "example_6_next",
idToggle: "undefined",
item: {
klass: "example_6_item",
size: 640
},
animation: {
type: "scroll",
duration: 1000,
amount: 1
}
});
$("thumb0").addEvent("click", function(event){new Event(event).stop();ex6Carousel.goTo(0)});
$("thumb1").addEvent("click", function(event){new Event(event).stop();ex6Carousel.goTo(1)});
$("thumb2").addEvent("click", function(event){new Event(event).stop();ex6Carousel.goTo(2)});
$("thumb3").addEvent("click", function(event){new Event(event).stop();ex6Carousel.goTo(3)});
$("thumb4").addEvent("click", function(event){new Event(event).stop();ex6Carousel.goTo(4)});
$("thumb5").addEvent("click", function(event){new Event(event).stop();ex6Carousel.goTo(5)});
$("thumb6").addEvent("click", function(event){new Event(event).stop();ex6Carousel.goTo(6)});
});
</script>
</head>
<body>
<div id="container">
<div id="container_hd"></div>
<div id="container_bd">
<h1>iCarousel - Horizontal images slider</h1>
<p>by Fabio Zendhi Nagao (<a href="http://zend.lojcomm.com.br">http://zend.lojcomm.com.br</a>)</p>
<form action="#">
<dl id="accordionExample" class="accordion">
<dt class="accordion_toggler">Example</dt>
<dd class="accordion_content">
<br />
<h3>VI. Horizontal images slider</h3>
<div id="example_6">
<ul id="example_6_content">
<li class="example_6_item"><a href="#"><img src="http://zendold.lojcomm.com.br/icarousel/images/ex6_1.jpg" alt="slide 1" /></a></li>
<li class="example_6_item"><a href="#"><img src="http://zendold.lojcomm.com.br/icarousel/images/ex6_2.jpg" alt="slide 2" /></a></li>
<li class="example_6_item"><a href="#"><img src="http://zendold.lojcomm.com.br/icarousel/images/ex6_3.jpg" alt="slide 3" /></a></li>
<li class="example_6_item"><a href="#"><img src="http://zendold.lojcomm.com.br/icarousel/images/ex6_4.jpg" alt="slide 4" /></a></li>
<li class="example_6_item"><a href="#"><img src="http://zendold.lojcomm.com.br/icarousel/images/ex6_5.jpg" alt="slide 5" /></a></li>
<li class="example_6_item"><a href="#"><img src="http://zendold.lojcomm.com.br/icarousel/images/ex6_6.jpg" alt="slide 6" /></a></li>
<li class="example_6_item"><a href="#"><img src="http://zendold.lojcomm.com.br/icarousel/images/ex6_7.jpg" alt="slide 7" /></a></li>
</ul>
<div id="example_6_frame">
<ul>
<li><a href="#"><img id="thumb0" src="http://zendold.lojcomm.com.br/icarousel/images/ex6_1t.jpg" alt="thumbnail 1" /></a></li>
<li><a href="#"><img id="thumb1" src="http://zendold.lojcomm.com.br/icarousel/images/ex6_2t.jpg" alt="thumbnail 2" /></a></li>
<li><a href="#"><img id="thumb2" src="http://zendold.lojcomm.com.br/icarousel/images/ex6_3t.jpg" alt="thumbnail 3" /></a></li>
<li><a href="#"><img id="thumb3" src="http://zendold.lojcomm.com.br/icarousel/images/ex6_4t.jpg" alt="thumbnail 4" /></a></li>
<li><a href="#"><img id="thumb4" src="http://zendold.lojcomm.com.br/icarousel/images/ex6_5t.jpg" alt="thumbnail 5" /></a></li>
<li><a href="#"><img id="thumb5" src="http://zendold.lojcomm.com.br/icarousel/images/ex6_6t.jpg" alt="thumbnail 6" /></a></li>
<li><a href="#"><img id="thumb6" src="http://zendold.lojcomm.com.br/icarousel/images/ex6_7t.jpg" alt="thumbnail 7" /></a></li>
</ul>
</div>
</div>
</body>
</html> |
Merci d'avance pour votre aide :mrgreen:
