28172 sujets

CSS et mise en forme, CSS3

Salut à tous,

C'est la première fois que j'utilise http://www.huddletogether.com/projects/lightbox2/
et à priori c'est assez simple ... langue

Le problème c'est quand je clique sur la vignette, au moment ou l'image apparait en taille normal elle est complètement décalé par rapport au conteneur du script ...

J'ai cherché pendant une heure, dans le code css de lightbox et dans le mien ... je ne vois pas du tout de quoi ça vient ...


je sais mon css est un long :

http://www.cijoint.fr/cj201012/cijeKbnnKE.txt

Merci pour votre aide.
Hello.

Le script que tu utilises place la lightbox en absolute.
Tes images ne seraient pas positionnées en absolute/relative à tout hasard?
Ou une marge qui traine sur tes images?


Sans une page en ligne, ça va être difficile de t'aider pour ce genre de souci.
Modifié par Florian_R (03 Dec 2010 - 13:59)
Bonjour,

pour l'instant je ne peux pas la mettre en ligne. Je pourrais faire ça demain.

Par contre je peux te fournir le code HTML qui contient les images :




<div class="carre06"><div class="up_photo_mini_all"><div class="up_photo_mini"><a href="images/photo/12/\1.jpeg" alt="Image"" rel="lightbox[roadtrip]"><img src="images/photo/12/mini\1.jpeg" alt="Image" /></a></div><div class="up_photo_mini"><a href="images/photo/12/\3.jpeg" alt="Image"" rel="lightbox[roadtrip]"><img src="images/photo/12/mini\3.jpeg" alt="Image" /></a></div><div class="up_photo_mini"><a href="images/photo/12/\4.jpeg" alt="Image"" rel="lightbox[roadtrip]"><img src="images/photo/12/mini\4.jpeg" alt="Image" /></a></div><div class="up_photo_mini"><a href="images/photo/12/\8.jpeg" alt="Image"" rel="lightbox[roadtrip]"><img src="images/photo/12/mini\8.jpeg" alt="Image" /></a></div></div><div class="up_photo_maxi"><img src="images/photo/12/1.jpeg" alt="Image" /></a></div></div>


J'ai jeté un œil rapide. Plusieurs remarques :

- Le lien sur ta dernière image (dans ta div .up_photo_maxi) est fermé, mais pas ouvert.
C'est une cause possible de ton souci d'affichage.

- Ta CSS est über monstruous (>3000 lignes). Tu dois pouvoir la réduire au minimum de 25% en virant le code mort et en utilisant des raccourcis.

- Dans l'url de tes images, le backlash me semble assez étrange. Sur quel OS testes-tu?

- Le alt="Image" ne signifie rien. Remplace le par quelque chose de significatif. Dans l'état c'est plus une gêne qu'autre chose.

- Je sais que le rel="lightbox" est imposé par le script. Personnellement je trouve ça plutôt crade, c'est même pour ça que je n'utilise pas cette lightbox.

- Tu peux simplifier ton html en utilisant la cascade dans ta css, et virer tes classes .up_photo_mini

Redis si ça corrige le problème, sinon la meilleure solution, c'est une page en ligne et Firebug
Bonjour et pardon pour le retard, voilà je l'ai mis en ligne :

http://www.swapnfly.fr/profiladh-logement-etudiant-2.html

Au fait j'ai différent BUG...

1) Lorsque l'on clique sur une photo, au moment de l'affichage, la photo saute...

2) Les boutons next et end changent de place en fonction de la photo...

3) j'ai désactivé la ligne suivant du css :



/*#overlay{ position: absolute; top: 0; left: 0; z-index: 90; width: 100%; height: 500px; background-color: #000; }*/



Car lorsque cette ligne est activé, j'ai un gros bloc noir qui couvre toute ma page...