Carousel et dimensions

Bonjour à toutes et tous

j'ai mis en place un carrousel en full width sur mon portfolio, il passe bien sur une dimension d'écran 1920x1200 mais lorsque j'ouvre ma page sur un écran plus petit il ne reste pas centré.

Auriez vous une piste pour moi ?

visible à cette adresse : http://www.el-be.fr/beta/home/portfolio.php

merci d'avance pour votre aide.

Logan.

Salut,

Tu as deux déclarations pour #page, dans la première tu spécifies bien un margin: 0 auto et une width de 1200px pour que le contenu soit centré. Par contre dans ta deuxième déclaration (qui vient écraser l'autre car elle se trouver après dans le code) tu déclare un width à 100% qui vient écraser l'ancienne propriété.

Donc ton margin: 0 auto n'a plus d'effet visible vu que #page prend toute la largueur du conteneur parent (qui est body et qui occupe tout l'écran).

En espérant avoir été clair

très clair merci

malheureusement cela ne résout pas mon problème. j'ai toujours ma div qui n'est pas centrée dans mon portfolio même après avoir enlevé la 2nd déclaration. J'ai donc ma #page qui a un width de 1200px par héritage de la déclaration de cette même div dans mon style.css ... Le truc c'est que si je mets cette largeur à 980px ça se centre, mais (y a toujours un "mais") le carrousel ne se fait plus que sur cette largeur et plus sur toute la largeur de l'écran. Ce qui est logique. j'aimerai faire en sorte que le carrousel se fasse en full screen.

Merci encore à toi gigi
Modifié par Pooley (19 Feb 2012 - 23:28)

Qu'appels-tu par full screen ? car pour le moment le slide ne se fait pas sur toute la largueur de l'écran mais seulement sur ton div de 1200px.

Je ne sais pas ta résolution mais peut être que chez toi ça te donne l'impression d'être en full screen car ça colle à ta résolution mais chez moi c'est quand même coupé.

Si on enlève le overflow:hidden sur .bx-window (généré par javascript) alors là effectivement ça prend toute la largueur de l'écran, mais si c'est ça que tu veux, à moins d'avoir des bonnes compétences en javascript, il va falloir que tu changes de plugins.

oui c'est en full screen "limité" que j'ai actuellement, car je suis en 1920x1200 chez moi et sur un écran plus grand ça va se cantonner à la largeur de la div (donc il y aura une "cassure" sur des dimensions supérieures à 1920px en largeur), j'en ai bien conscience en faisant un zoom out.
J'aurai effectivement aimé que le carrousel (et plus précisément la section):

1 - soit centré peu importe la largeur de l'écran,
2 - se fasse sur toute la largeur (mais en ne montrant qu'une section) donc un overflow:hidden nécessaire je pense.

Au cas ou je devrai changer de plug-in, en connais-tu un qui puisse faire l'affaire ?

Merci beaucoup
Modifié par Pooley (19 Feb 2012 - 23:51)

Hé bien figure toi que... non ! ^^

Car j'ai eu exactement le même problème pour mon site perso, je subis cette cassure désagréable depuis quelques semaines (pauvre de moi ), mais j'ai pas cherché d'alternative (j'utilise easyslide).

Si tu en trouves une je serai très intéressé de la connaitre

Sinon si je peux te donner un conseil c'est de ne pas te fier à ce que ton écran te montre car comme tu vois c'est fort changeant suivant les résolutions. Donc les width de 1200px c'est à éviter (selon moi). Dis-toi que les résolutions plus basses auront systématiquement un scroll horizontal, et ça c'est assez disgracieux, tu en conviendras ^^.

Bien à toi

Oui pour moi scroll horizontal hors de question ! c'est pas envisageable.
Le overflow:hidden empêchera le scroll horizontal sur les dimensions plus petites. Je suis actuellement sur 3 écrans (1920x1200 1440x900 et 1366x768) et je bascule régulièrement pour voir le résultat (j'embête aussi ma copine avec son petit laptop pour qu'elle m'affiche mon site sur un 1280x768 histoire de voir le bin's). Bien évidemment je souhaite que mon site soit visible à l'identique sur toutes les dimensions mais c'est à s'arracher les cheveux ! ...

Même si mon carrousel se limite à 1920px ça me va. mais je n'arrive pas à le faire scroller sur toute la largeur et qu'il soit centré. ou alors si j'y arrive mais en trichant, genre en mettant ma #page en width: 1920px; et en mettant ma #thumbz avec un padding-left: 455px; lol mais la magie n'opère que sur du 1920x1200 ^^ ...

Quoiqu'il en soit, merci Nicolas !
Modifié par Pooley (20 Feb 2012 - 00:06)

tu peux choisir un style d'easing avec easyslide ?

Lol effectivement c'est une sacré bricole juste pour occupé la largeur de la page (et que sur ta résolution en plus snif ^^).

Je viens de réessayer en CSS pour être sûr et effectivement les valeurs générées en javascript empêche toute bricole avec seulement CSS.

Il faudra obligatoirement changer de slider si tu ne veux pas mettre les mains dans le js.

Sinon, je ne sais pas ce que signifie easing dans se contexte, si tu sais m'éclairer sur le sujet n'hésite pas ^^, mais à priori je serai tenté de dire non, il n'y pas grand chose de paramétrable.

Enfin quoi qu'il en soit, de rien Logan, et bonne nuit

Le easing c'est l'effet que tu paramètres pour ton slide (exponentiel, elastique, bounce, cubic, ...) bon je vais rester sur celui que j'ai actuellement et faire de cette faiblesse une force avec du graphisme sur les côtés, je vais me pencher là-dessus. Allez hop je m'y remets !

Bonne nuit et merci !
Modifié par Pooley (20 Feb 2012 - 00:33)