Sujet Précédent Sujet Suivant

Agrandir la taille image

ciranox Messages postés 387 Date d'inscription vendredi 11 juillet 2008 Statut Membre Dernière intervention 28 février 2016 - 26 nov. 2010 à 19:31
PetoleTeam Messages postés 3426 Date d'inscription lundi 26 décembre 2005 Statut Membre Dernière intervention 14 janvier 2011 - 27 nov. 2010 à 15:51
Bonjour,

J'arrive pas à agrandir la hauteur des images de mon diaporama.

Aider moi S.V.P

voici le code: 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en-us">
<head>
<title>jCarousel Examples</title>
<link href="style.css" rel="stylesheet" type="text/css" />
<!--
  jQuery library
-->
<script type="text/javascript" src="jquery-1.4.2.min.js"></script>
<!--
  jCarousel library
-->
<script type="text/javascript" src="jquery.jcarousel.min.js"></script>
<!--
  jCarousel skin stylesheet
-->
<link rel="stylesheet" type="text/css" href="skin.css" />


<script type="text/javascript">
jQuery.easing['BounceEaseOut'] = function(p, t, b, c, d) {
if ((t/=d) < (1/2.75)) {
return c*(7.5625*t*t) + b;
} else if (t < (2/2.75)) {
return c*(7.5625*(t-=(1.5/2.75))*t + .75) + b;
} else if (t < (2.5/2.75)) {
return c*(7.5625*(t-=(2.25/2.75))*t + .9375) + b;
} else {
return c*(7.5625*(t-=(2.625/2.75))*t + .984375) + b;
}
};

jQuery(document).ready(function() {
    jQuery('#mycarousel').jcarousel({
        easing: 'BounceEaseOut',
        animation: 1500
    });
});

function mycarousel_initCallback(carousel)
{
    
    carousel.buttonNext.bind('click', function() {
        carousel.startAuto(20);
    });

    carousel.buttonPrev.bind('click', function() {
        carousel.startAuto(20);
    });

    
    carousel.clip.hover(function() {
        carousel.stopAuto();
    }, function() {
        carousel.startAuto();
    });
};

jQuery(document).ready(function() {
    jQuery('#mycarousel').jcarousel({
        auto: 3,
        wrap: 'last',
        initCallback: mycarousel_initCallback
    });
});

jQuery(document).ready(function() {
    jQuery('#mycarousel').jcarousel({
        visible:4.10
    });
});
</script>


</head>


  
    <li></li>
    <li></li>
    <li></li>
    <li></li>
    <li></li>
    <li></li>
    <li></li>
    <li></li>
    <li></li>
    <li></li>
  




</html>


voici le CSS:

.jcarousel-skin-tango .jcarousel-direction-rtl {
direction: rtl;
}

.jcarousel-skin-tango .jcarousel-container-horizontal {
    width: 651px;
    padding: 20px 40px;
}

.jcarousel-skin-tango .jcarousel-container-vertical {
    width: 75px;
    height: 245px;
    padding: 40px 20px;
}

.jcarousel-skin-tango .jcarousel-clip-horizontal {
    width:  650px;
    height: 75px;
}

.jcarousel-skin-tango .jcarousel-clip-vertical {
    width:  75px;
    height: 245px;
}

.jcarousel-skin-tango .jcarousel-item {
    width: 75px;
    height: 75px;
}

.jcarousel-skin-tango .jcarousel-item-horizontal {
margin-left: 0;
    margin-right: 10px;
}

.jcarousel-skin-tango .jcarousel-direction-rtl .jcarousel-item-horizontal {
margin-left: 10px;
    margin-right: 0;
}

.jcarousel-skin-tango .jcarousel-item-vertical {
    margin-bottom: 10px;
}

.jcarousel-skin-tango .jcarousel-item-placeholder {
    background: #fff;
    color: #000;
}

.jcarousel-skin-tango .jcarousel-next-horizontal {
    position: absolute;
    top: 43px;
    right: 5px;
    width: 32px;
    height: 32px;
    cursor: pointer;
    background: transparent url(skins/tango/next-horizontal.png) no-repeat 0 0;
}

.jcarousel-skin-tango .jcarousel-direction-rtl .jcarousel-next-horizontal {
    left: 5px;
    right: auto;
    background-image: url(skins/tango/prev-horizontal.png);
}

.jcarousel-skin-tango .jcarousel-next-horizontal:hover {
    background-position: -32px 0;
}

.jcarousel-skin-tango .jcarousel-next-horizontal:active {
    background-position: -64px 0;
}

.jcarousel-skin-tango .jcarousel-next-disabled-horizontal,
.jcarousel-skin-tango .jcarousel-next-disabled-horizontal:hover,
.jcarousel-skin-tango .jcarousel-next-disabled-horizontal:active {
    cursor: default;
    background-position: -96px 0;
}

.jcarousel-skin-tango .jcarousel-prev-horizontal {
    position: absolute;
    top: 43px;
    left: 5px;
    width: 32px;
    height: 32px;
    cursor: pointer;
    background: transparent url(skins/tango/prev-horizontal.png) no-repeat 0 0;
}

.jcarousel-skin-tango .jcarousel-direction-rtl .jcarousel-prev-horizontal {
    left: auto;
    right: 5px;
    background-image: url(skins/tango/next-horizontal.png);
}

.jcarousel-skin-tango .jcarousel-prev-horizontal:hover {
    background-position: -32px 0;
}

.jcarousel-skin-tango .jcarousel-prev-horizontal:active {
    background-position: -64px 0;
}

.jcarousel-skin-tango .jcarousel-prev-disabled-horizontal,
.jcarousel-skin-tango .jcarousel-prev-disabled-horizontal:hover,
.jcarousel-skin-tango .jcarousel-prev-disabled-horizontal:active {
    cursor: default;
    background-position: -96px 0;
}

.jcarousel-skin-tango .jcarousel-next-vertical {
    position: absolute;
    bottom: 5px;
    left: 43px;
    width: 32px;
    height: 32px;
    cursor: pointer;
    background: transparent url(skins/tango/next-vertical.png) no-repeat 0 0;
}

.jcarousel-skin-tango .jcarousel-next-vertical:hover {
    background-position: 0 -32px;
}

.jcarousel-skin-tango .jcarousel-next-vertical:active {
    background-position: 0 -64px;
}

.jcarousel-skin-tango .jcarousel-next-disabled-vertical,
.jcarousel-skin-tango .jcarousel-next-disabled-vertical:hover,
.jcarousel-skin-tango .jcarousel-next-disabled-vertical:active {
    cursor: default;
    background-position: 0 -96px;
}

.jcarousel-skin-tango .jcarousel-prev-vertical {
    position: absolute;
    top: 5px;
    left: 43px;
    width: 32px;
    height: 32px;
    cursor: pointer;
    background: transparent url(skins/tango/prev-vertical.png) no-repeat 0 0;
}

.jcarousel-skin-tango .jcarousel-prev-vertical:hover {
    background-position: 0 -32px;
}

.jcarousel-skin-tango .jcarousel-prev-vertical:active {
    background-position: 0 -64px;
}

.jcarousel-skin-tango .jcarousel-prev-disabled-vertical,
.jcarousel-skin-tango .jcarousel-prev-disabled-vertical:hover,
.jcarousel-skin-tango .jcarousel-prev-disabled-vertical:active {
    cursor: default;
    background-position: 0 -96px;
}



Merci d'avance.

3 réponses

Réponse 1 / 3
PetoleTeam Messages postés 3426 Date d'inscription lundi 26 décembre 2005 Statut Membre Dernière intervention 14 janvier 2011 17
27 nov. 2010 à 09:05
Bonjour,
J'arrive pas à agrandir la hauteur des images de mon diaporama.
crées des images à la dimension voulue, me semble la meilleur solution.

Sinon il existe le basique 




juste une question, c'est quoi tous ces

jQuery(document).ready(function() {
  jQuery('#mycarousel').jcarousel({
    ...
  });
}
?????



L'utilisation de jQuery n'empêche pas, voir même l'inverse, de comprendre le javascript !







;O)


                
                

    
        

    
            
        0
        
            
                
    

            



    

        
        
    


        

                            

                        


    

        
        
    

                    

                        

                    

        

    

        

            
        

    

    

    

        

        
        
        

                        Réponse 2 / 3
        


        
                    

                

        

                    

        
            
    
    

            

    


            

                

        
                    ciranox
    
        
                    Messages postés
            
                
            387
                
                            Date d'inscription
            vendredi 11 juillet 2008
                            Statut
            Membre
                            Dernière intervention
            28 février 2016
            

                    

                    27 nov. 2010 à 13:50
                        

    


    

                        

                    Salut PetoleTeam,



Merci de m'avoir répondu. J'ai déjà essayé d'agrandir la hauteur de cette façon ( width="la_largeur" height="la_hauteur" /> ) Malheureusement ça ne marche pas !



Le diaporama je les téléchargé sur ce site: http://sorgalla.com/projects/jcarousel/
                
                

    
        

    
            
        0
        
            
                
    

            



    

        
        
    


        

                            

                        


    

        
        
    

                    

                        

                    

        

    

        

            
        

    

    

    

        

        
        
        

                        Réponse 3 / 3
        


        
                        
                    

                

        

                    

        
            
    
    

                
            

    


            

                

        
                    PetoleTeam
    
        
                    Messages postés
            
                
            3426
                
                            Date d'inscription
            lundi 26 décembre 2005
                            Statut
            Membre
                            Dernière intervention
            14 janvier 2011
            

            
                    17
    
    
                    

                    27 nov. 2010 à 15:51
                        

    


    

                        

                    visiblement c'est un peu tordu à configurer puisque géré par le CSS

à modifier donc apparemment

/*-- cadre exterieur --*/
.jcarousel-skin-tango .jcarousel-container-horizontal {
}
/*-- cadre interieur --*/
.jcarousel-skin-tango .jcarousel-clip-horizontal {
}
/*-- zone image individuelle --*/
.jcarousel-skin-tango .jcarousel-item {
}
et peut être d'autre...



;O)


                
                

    
        

    
            
        0
        
            
                
    

            



    

        
        
    


        

                

                    

        

    

        

            
        

    

    

    

        

    


    

    
    




    
Discussions similaires

                                                    

                
                    [D7] Impression code-barres sur une imprimante d'étiquettes
                    

                        
    
    

                
            

    


                        

                                                                                    cs_nitrique -  

                            
                                                                                    cs_nitrique - 
                        

                    

                    

                    

                        15 réponses
                    

                
            

                                                        

                
                    recuperer la taille d'un tableau avec php, c'est possible??
                    

                        
    
    

                
            

    


                        

                                                                                    cs_redemption -  

                            
                                                                                    JaMyGG - 
                        

                    

                    

                    

                        8 réponses
                    

                
            

                                                        

                
                    Condition d'une valeur dans un tableau
                    

                        
    
    

            

    


                        

                                                                                    solomonn -  

                            
                                                                                    solomonn - 
                        

                    

                    

                    

                        17 réponses
                    

                
            

                                                        

                
                    Comment récuperer la taille d'une image JPEG
                    

                        
    
    

                
            

    


                        

                                                                                    Cirec -  

                            
                                                                                    cirec - 
                        

                    

                    

                    

                        15 réponses
                    

                
            

                                                        

                
                    image avec FPDF
                    

                        
    
    

            

    


                        

                                                                                    cs_sebalex -  

                            
                                                                                    Franck - 
                        

                    

                    

                    

                        12 réponses
                    

                
            

            
    
    





    

    



    






                        

                    

                


                

    


    







    

        Rejoignez-nous