Bonjour.
Je suis nouveau sur ce forum, et si je viens vers vous aujourd'hui, c'est que j'ai un petit problème dans le développement du site web de mon associé (je suis graphiste indépendant.)
Ce site est un site en responsive, ou tout est en pourcentage.
Mon problème : J'utilise le plugin Jquery "Cloud Carousel" dans mon menu principal, des petits pictogrammes qui tournent en cercle donc.
http://www.professorcloud.com/mainsite/carousel.htm
Ces éléments sont contenus dans un conteneur appelé "cont_navig", dont le width et le height sont établis eux aussi en pourcentage.
Voici ma fonction faisant appel a CloudCarousel :
Le problème, c'est que xPos, yPos, xRdius et yRadius ne s'adapte bien sûr pas à la taille du contenaire (".cont_navig"), pour celà, il faudrais que je définisse un truc du genre :
Code : Sélectionner tout - Visualiser dans une fenêtre à part
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 <script> $(document).ready(function(){ // This initialises carousels on the container elements specified, in this case, carousel1. $(".cont_navig").CloudCarousel( { xPos:100, yPos:80, minScale:0.2, xRadius:100, yRadius:60, autoRotateDelay: 1000, speed:0.1, FPS:30, buttonLeft: $("#nav_l"), buttonRight: $("#nav_r"), altBox: $("#alt-text"), titleBox: $("#title-text"), autoRotate: 'left', mouseWheel:true, bringToFront:true } ); });
(pour l'exemple de xRadius)
Code : Sélectionner tout - Visualiser dans une fenêtre à part xRadius:$(".cont_navig").width()/2,
Donc j'ai essayé en faisant ça :
Mais ça ne marche pas, je pense que c'est tout bonnement un problème de syntaxe, mais ça fait deux jours je suis dessus, et je n'y arrive pas.
Code : Sélectionner tout - Visualiser dans une fenêtre à part
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 <script> $(document).ready(function(){ // This initialises carousels on the container elements specified, in this case, carousel1. $(".cont_navig").CloudCarousel( { xPos:$(".cont_navig").width()/2, yPos:$(".cont_navig").width()/2, minScale:0.2, xRadius:$(".cont_navig").width()/2, yRadius:$(".cont_navig").height()/2, autoRotateDelay: 1000, speed:0.1, FPS:30, buttonLeft: $("#nav_l"), buttonRight: $("#nav_r"), altBox: $("#alt-text"), titleBox: $("#title-text"), autoRotate: 'left', mouseWheel:true, bringToFront:true } ); }); </script>
Partager