Bonjour,
Mon objectif est de réaliser ceci => http://jquerytools.org/demos/scrollable/gallery.htm.
Je n'ai pas eu de problème pour que cela fonctionne.
cependant mon problème ce trouve sur le positionnement css des vignettes (carré rouge "illustration") dans la scrollbar.
Je souhaiterai leur donner des marges "left-right" automatique selon la taille du div (cadre noir "illustration").
Puisque j'ai des largeurs d'images aléatoire comment faire en sorte quelles prennent tjs toutes la largeur du div.
Pour le moment j'ai mis une marge gauche de 4% qui fonctionne si les quatres images on une largeur de 200px.
Si l'une des images est plus petite j'ai un espace vide a droite.
Mon résultat actuelle:
illustration
Code :
- <div class="scrollable" id="navigator">
- <div class="items">
- <div>
- <img src='' />
- <img src='' />
- <img src='' />
- <img src='' />
- </div>
- <div>
- <img src='' />
- <img src='' />
- <img src='' />
- <img src='' />
- </div>
- </div>
- </div>
|
Code :
- .scrollable .items {
- width:20000em;
- position:absolute;
- clear:both;
-
- }
- .items div {
- float:left;
- display:block;
- width:845px;
- }
- .items img{
- max-width:200px;
- height:90px;
- margin: 0 0 0 4%;
- border:2px solid #666;
- }
|
Merci pour votre aide.
