Bonjour à tous.

Pour les besoins de mon stage j'ai besoin de créer un slider accordeon pour un site web.

J'ai donc pris un slider sur internet et modifier le code html et css et quelque peu le .js à ma façon, mais ou se trouve le problème, c'est que je n'arrive pas à afficher directement le slider déja ouvert.

C'est à dire que le slide se joue directement à l'ouverture/rafraichissement de la page, alors que j'aimerais qu'il reste static au début et que le slide débute seulement quand je clique sur mes lien. J'ai cherché et je n'ai pas trouvé, donc si quelqu'un pourrait regarder mon code, ça serait énormément sympa.


html:
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
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link rel="stylesheet" type="text/css" href="css/accordion.css" />
<script language="javascript" type="text/javascript" src="js/jquery-1.3.2.min.js"></script>
<script language="javascript" type="text/javascript" src="js/jquery.msAccordion.js"></script>
<title>Common Accordion</title>
<style type="text/css">
.set{border-bottom:1px solid #000}
.set1{background: -moz-linear-gradient(center top , #1D292F, #27363E) repeat scroll 0 0 transparent; border-top: 1px solid #44606E;}
.set2{background: -moz-linear-gradient(center top , #1D292F, #27363E) repeat scroll 0 0 transparent; border-top: 1px solid #44606E;}
.set3{background: -moz-linear-gradient(center top , #1D292F, #27363E) repeat scroll 0 0 transparent; border-top: 1px solid #44606E;}
.set4{background: -moz-linear-gradient(center top , #1D292F, #27363E) repeat scroll 0 0 transparent; border-top: 1px solid #44606E;}
.set5{background: -moz-linear-gradient(center top , #1D292F, #27363E) repeat scroll 0 0 transparent; border-top: 1px solid #44606E;}
.set6{background: -moz-linear-gradient(center top , #1D292F, #27363E) repeat scroll 0 0 transparent; border-top: 1px solid #44606E;}
.set7{background: -moz-linear-gradient(center top , #1D292F, #27363E) repeat scroll 0 0 transparent; border-top: 1px solid #44606E;}
</style>
</head>
 
<body>
 
 
<div id="corps">
 
 
	<div id="accordion3" class="accordionWrapper">
 
 
 
		<div class="set set1">
   			 	<div class="title"> <p>Nos dernières ventes</p> </div>
    			<div class="content">  <div class="paragraphe"> <p> <img class = "image" src="image/menu-img-1.jpg" width="200" height="100" />Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed tortor dolor, lobortis at molestie at, interdum a purus. Cras ornare, diam vitae dapibus lobortis, purus lacus vulputate tellus, ac sollicitudin sapien tellus vitae erat. Aliquam libero sem, pretium et ultricies sit amet, sodales fringilla ipsum. Integer id risus risus.consectetur adipiscing elit. Sed tortor dolor, lobortis at molestie at, interdum a purus. Cras ornare, diam vitae dapibus lobortis, purus lacus vulputate tellus, ac sollicitudin sapien tellus vitae erat. Aliquam libero sem, pretium et ultricies sit amet, sodales fringilla ipsum. Integer id risus risus.</p> </div> </div>
		</div>
 
 
 
		<div class="set set2">
    			<div class="title"><p>Nos dernières location</p> </div>
    			<div class="content"><img src="image/menu-img-2.jpg" width="680" height="198" /></div>
		</div>
 
 
 
		<div class="set set3">
    			<div class="title"><p>Nos coups de coeur</p> </div>
    			<div class="content"><img src="image/menu-img-3.jpg" width="680" height="198" /></div>
		</div>
 
 
 
		<div class="set set4">
    			<div class="title"><p>Nos exclusivités</p> </div>
   			 	<div class="content"><img src="image/menu-img-4.jpg" width="680" height="198" /><br /></div>
		</div>
 
 
	</div>
 
</div>
 
 
<script language="javascript" type="text/javascript">
$(document).ready(function() {
 
						   $("#accordion3").msAccordion({defaultid:0, vertical:true});
 
						   }
						   )
</script>
</body>
</html>


css:
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
.accordionWrapper{display:inline-block; background-color:#fff; overflow:hidden;}
.accordionWrapper img{vertical-align:top; border:0; margin:0; padding:0}
.accordionWrapper div{display:inline; float:left; margin:auto;}
.accordionWrapper div.title{cursor:pointer;}
.accordionWrapper div.content{display:none;}
 
#corps
{
width: 1400px;
height: 1000px;
margin: auto;
 
}
 
#accordion3
{
	border-right: 2px solid #44606E;
	border-left: 2px solid #44606E;
	border-bottom: 2px solid #44606E;
	margin-left:310px;
 
}
 
.title
{
	width: 680px;
	background: -moz-linear-gradient(center top , #1D292F, #27363E) repeat scroll 0 0 transparent;
	height: 40px;
	color: white;
}
 
.content
{
	color: white;
	width: 680px;
	height: 200px;
	overflow: auto;
	margin-left: 20px;
	background-color: #44606E;
}
 
.image
{
	float: left;
}
 
.content img
{
	padding-top: 1px;
}
 
.paragraphe img
{
	margin-left: 20px;
	margin-right: 20px;
}
 
.title:hover
{
	background: -moz-linear-gradient(center top , #1D292F, #27363E) repeat scroll 0 0 transparent;
	font-size: 40px;
}
 
.title p
{
	margin:0;
	font-size: 22px;
	padding-top: 5px;
	padding-left:10px;
}




mon fichier slide:

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
//menu Accordion
//author: Marghoob Suleman
//Date: 05th Aug, 2009
//Version: 1.0
//web: www.giftlelo.com | www.marghoobsuleman.com
;(function($){
	$.fn.msAccordion = function(options) {
		options = $.extend({
					currentDiv:'1',
					previousDiv:'',
					vertical: false,
					defaultid:0,
					currentcounter:0,
					intervalid:0,
					autodelay:0,
					event:"click",
					alldivs_array:new Array()
			}, options);
		$(this).addClass("accordionWrapper");
		$(this).css({overflow:"hidden"});
		//alert(this);
		var elementid = $(this).attr("id");
		var allDivs = this.children();
		if(options.autodelay>0)  {
			$("#"+ elementid +" > div").bind("mouseenter", function(){
														   pause();
														   });
			$("#"+ elementid +" > div").bind("mouseleave", function(){
																  startPlay();
																  });
		}
		//set ids
		allDivs.each(function(current) {
								 var iCurrent = current;
								 var sTitleID = elementid+"_msTitle_"+(iCurrent);
								 var sContentID = sTitleID+"_msContent_"+(iCurrent);
								 var currentDiv = allDivs[iCurrent];
								 var totalChild = currentDiv.childNodes.length;
								 var titleDiv = $(currentDiv).find("div.title");
								 titleDiv.attr("id", sTitleID);
								 var contentDiv = $(currentDiv).find("div.content");
								 contentDiv.attr("id", sContentID);
								 options.alldivs_array.push(sTitleID);
								 //$("#"+sTitleID).click(function(){openMe(sTitleID);});
								 $("#"+sTitleID).bind(options.event, function(){pause();openMe(sTitleID);});
								 });
 
		//make vertical
		if(options.vertical) {makeVertical();};
		//open default
		openMe(elementid+"_msTitle_"+options.defaultid);
		if(options.autodelay>0) {startPlay();};
		//alert(allDivs.length);
		function openMe(id) {
			var sTitleID = id;
			var iCurrent = sTitleID.split("_")[sTitleID.split("_").length-1];
			options.currentcounter = iCurrent;
			var sContentID = id+"_msContent_"+iCurrent;
			if($("#"+sContentID).css("display")=="none") {
				if(options.previousDiv!="") {
					closeMe(options.previousDiv);
				};
				if(options.vertical) {
					$("#"+sContentID).slideDown("fast");
				} else {
					$("#"+sContentID).show("fast");
				}
				options.currentDiv = sContentID;
				options.previousDiv = options.currentDiv;
			};
		};
		function closeMe(div) {
			if(options.vertical) {
				$("#"+div).slideUp("fast");
			} else {
				$("#"+div).hide("fast");
			};
		};	
		function makeVertical() {
			$("#"+elementid +" > div").css({display:"block", float:"none", clear:"both"});
			$("#"+elementid +" > div > div.title").css({display:"block", float:"none", clear:"both"});
			$("#"+elementid +" > div > div.content").css({clear:"both"});
		};
		function startPlay() {
			options.intervalid = window.setInterval(play, options.autodelay*1000);
		};
		function play() {
			var sTitleId = options.alldivs_array[options.currentcounter];
			openMe(sTitleId);
			options.currentcounter++;
			if(options.currentcounter==options.alldivs_array.length) options.currentcounter = 0;
		};
		function pause() {
			window.clearInterval(options.intervalid);
		};
		}
})(jQuery);



Merci au courageux qui m'aidera si quelqu'un passe par là.