JQuery - Cycle - Image de taille différente - Centrage
Bonjour,
J'affiche un fondu d'image enchainé dans un div avec le plugin "Cycle" de jQuery. Le problème c'est que mes images ne sont pas toute de la même taille. Du coup je n'arrive pas à centrer l'image de le div.
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
| <style type="text/css">
.slideshow {
height: 350px;
width: 800px;
top : 20px;
margin : auto;
vertical-align : middle;
text-align : center;
background-color : #000000;
z-index:1;}
.slideshow img {
margin : auto;
padding : auto;
height : 350px;
vertical-align : middle;
text-align : center;
border : 1px solid #000000;
box-shadow :0 0 5px black;
}
</style>
<script type="text/javascript" src="js/jquery-1.7.min.js"></script>
<script type="text/javascript" src="js/jquery.cycle.all.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$('.slideshow').cycle({fx: 'fade' /*choose your transition type, ex: fade, scrollUp, shuffle, etc...*/});
$('.slideshow').cycle({timeout: 500});
});
</script>
<div class="slideshow">
<img src="Images/Home/home1.jpg"/>
<img src="Images/Home/home2.jpg"/>
<img src="Images/Home/home3.jpg"/>
<img src="Images/Home/home4.jpg"/>
<img src="Images/Home/home5.jpg"/>
<img src="Images/Home/home6.jpg"/>
<img src="Images/Home/home7.jpg"/>
<img src="Images/Home/home8.jpg"/>
<img src="Images/Home/home9.jpg"/>
<img src="Images/Home/home10.jpg"/>
<img src="Images/Home/home11.jpg"/>
<img src="Images/Home/home12.jpg"/>
</div> |
Quelqu'un a-t-il une idée ?
