11496 sujets

JavaScript, DOM et API Web HTML5

Carrousel 3D jQuery

Bonjour!
Je m'adresse à vous en désespoir de cause... J'ai trouvé ce scritp pour faire un carrousel.

J'ai intégré ça dans ma page, modifier les images, la vitesse de rotation, etc. Mais un problème demeure, le carrousel semble flotter dans ma page. Le titre apparait sous le carrousel, et le reste de la page ne suis pas la hauteur du carrousel.

C par là!

J'ai remarqué que dans le code du fichier "jquery.carousel3d.js" à la ligne 92 il y a écrit "position: 'absolute'". J'ai tenté de changer pour relative, mais ça c'est mis à tournée dans tout les sens... j'ai tenter d'arranger ça via mon CSS, impossible, rien de bouge.

Voilà où j'en suis.

Merci d'avance pour votre aide!
Modifié par juliesunset (17 Jul 2009 - 14:43)
Salut,

Peut être que tu peux mettre une balise <hr/> après tes zones de texte puis mettre en style celà :

hr{
clear:both;
}

Mais bon ce n'est pas sûr que ça marche. Sinon tu peux tenter de mettre le caroussel dans une div qui elle sera positionnée en relative. Peut être que ça va arranger les choses ^^
Merci pour ta réponse!

pour la balise Hr, j'avais déjà une balise comme celle-ci: <div classe="spacer"></div> avec une clear:both dans mon CSS.
J'avais essayé de la déplacer à plusieurs endroit différents, mais ça change rien.

Ensuite j'ai placé mon div carousel dans un autre div placé en relative, malheureusement le carrousel se place dans le coin droit de ma page, sous le flux (c'est bien comme ça qu'on dit?)... en dehors de ma mise en page.

entre temps j'avais fouillé un peu dans le code et j'ai ajouté quelques lignes pour faire disparaître et réapparaître le titre de la page quand on clic sur un élément du carrousel (un exploit en soi pour moi! Smiley lol )

J'ai également remarqué cette ligne de code dans le code source de la page

<script type="text/javascript">
		jQuery(function($) {
			$("#carousel").html($("#holder_images").html()).carousel3d({control: 'mouse', textBox:1, centerX: $('#carousel').offset().left + $('#carousel').width()/2 }); 
		});
	</script>


C'est le seul endroit que j'ai vue qui faisais directement allusion à ma div carousel, après plus rien...
Bon, après une bonne semaine de vacances, voilà que je reviens sur le problème...

Je me suis penché un bon moment là-dessus aujourd'hui, mais je suis comme dirait-on à cours d'idée... Smiley fou
bon y'a pas vraiment d'évolution sinon que j'ai tenté l'application de z-index sur mes div placé en relative et absolute en espérant un changement, mais rien...
Deux pistes :

_ As tu essayé de précisé une Height pour ta division "carousel" ?
_ As-tu essayé de mettre une div clear both juste en dessous de celle de "caroussel" ?
oui et oui!
J'ai essayé... padding, margin, position, z-index... et je ne sais plus quoi encore! Apliqué à carousel, position, ou encore holder_images...

Si j'applique un padding, un margin ou un height, ce que ça fait, ça crée un décalage soi du fond, soi du carrousel. Lorsque que je clique sur l'un des éléments du carrousel, l'espace demeure et crée donc un grand espace non utilisé avant le texte. Esthétiquement parlant... j'aime pas.

Je regarde le code et le décortique... voici ce que j'en comprend tranquillement pas vite:
1. La div carousel ne me sert que lorsque le javascript est désactivé (ce qui tout de même une bonne chose en soi!). Si j'enlève les images dans "carousel" et garde celles dans la div "holder_images", mon carrousel est toujours présent...

2. Les paramètres de rotation et du carrousel proprement dit ne concerne que la div "holder_images" précisément.

Plus j'y pense et plus je crois que la solution se trouve dans le code js du carrousel, quant à savoir où et comment modifier ça... y'a encore du boulot!
Sujet clos
Aller à