28172 sujets

CSS et mise en forme, CSS3

Bonjour à tous,

en survolant le net, j'ai cru comprendre qu'il était possible de créer des transitions avec effet fondu entre deux pages html, avec du CSS.

J'aimerai qu'à chaque clics, la transition se fasse en fondu ( progressif ).

J'ai trouvé ceci sur un site anglais :

     
         -webkit-transition: all 400ms cubic-bezier(0.665, 0.005, 0.580, 1.000); 
   -moz-transition: all 400ms cubic-bezier(0.665, 0.005, 0.580, 1.000); 
     -o-transition: all 400ms cubic-bezier(0.665, 0.005, 0.580, 1.000); 
        transition: all 400ms cubic-bezier(0.665, 0.005, 0.580, 1.000); /* custom */

-webkit-transition-timing-function: cubic-bezier(0.665, 0.005, 0.580, 1.000); 
   -moz-transition-timing-function: cubic-bezier(0.665, 0.005, 0.580, 1.000); 
     -o-transition-timing-function: cubic-bezier(0.665, 0.005, 0.580, 1.000); 
        transition-timing-function: cubic-bezier(0.665, 0.005, 0.580, 1.000); /* custom */


A priori ça ne fonctionne pas, mais je ne suis pas sur de l'avoir placé au bon endroit ..

a{
     color: black;
     text-decoration:none;
     
         -webkit-transition: all 400ms cubic-bezier(0.665, 0.005, 0.580, 1.000); 
   -moz-transition: all 400ms cubic-bezier(0.665, 0.005, 0.580, 1.000); 
     -o-transition: all 400ms cubic-bezier(0.665, 0.005, 0.580, 1.000); 
        transition: all 400ms cubic-bezier(0.665, 0.005, 0.580, 1.000); /* custom */

-webkit-transition-timing-function: cubic-bezier(0.665, 0.005, 0.580, 1.000); 
   -moz-transition-timing-function: cubic-bezier(0.665, 0.005, 0.580, 1.000); 
     -o-transition-timing-function: cubic-bezier(0.665, 0.005, 0.580, 1.000); 
        transition-timing-function: cubic-bezier(0.665, 0.005, 0.580, 1.000); /* custom */
    
    
}


Merci de votre aide ! Smiley biggrin
Bonjour.

Hélas, le CSS ne sera pas suffisant, pour faire une transition entre deux pages, il te faudra utiliser du javascript pour ça, Ajax plus précisément.