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.

[URL="http://www.professorcloud.com/mainsite/carousel.htm"]http://www.professorcloud.com/mainsite/carousel.htm[/URL]

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 :

<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
        }

    );
});

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 :

xRadius:$(".cont_navig").width()/2,

(pour l'exemple de xRadius)

Donc j'ai essayé en faisant ça :

<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>

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.

3 réponses


ZEDYX
Auteur

Quelqu'un de calé aurait-il une solution ?
J'ai vraiment besoin d'aide...please...

Bonsoir,
j'ai un peu du mal a me représenter la situation, peut-on voir le résultat à une url ? ou avoir un code permettant de reproduire le soucis en local ?

ZEDYX
Auteur

Bonsoir. Problème résolu, j'ai adapté un autre code. Merci quand même.