Effet rotatif sur titre des forums

Voir le sujet précédent Voir le sujet suivant Aller en bas

Résolu Effet rotatif sur titre des forums

Message par Lucas.Y le Dim 11 Aoû 2013 - 0:32

Bonjour alors comme l'explique le titre de mon sujet J'aimerais appliquer le code CSS transform: rotate sur le titre de mes forums affiché dans mes catégories ! J'ai essayé mais je n'y arrive pas ! Un peu d'aide s'il vous plait !

Voici mon code css :

Code:
/*titre des forums sur catégories*/
span.forumname
{
margin-left: 250px;

         
}
span.forumname:hover
{
  
 -webkit-transform: rotate(360deg);
-moz-transform: rotate(360deg);
-o-transform: rotate(360deg);
transform: rotate(360deg);
}


Dernière édition par Lucas.Y le Lun 26 Aoû 2013 - 21:43, édité 1 fois

Lucas.Y
*

Féminin
Messages : 38
Inscrit(e) le : 05/07/2013

http://littlestars.forumactif.org/
Lucas.Y a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Effet rotatif sur titre des forums

Message par pierre du 31 le Dim 11 Aoû 2013 - 2:00

en espérant vous aider

droite
Code:
<p id="rotate">
Ton texte
</p>
Code:
p#rotate img
{
-moz-transition: all 0.8s ease-in-out;
-webkit-transition: all 0.8s ease-in-out;
-o-transition: all 0.8s ease-in-out;
-ms-transition: all 0.8s ease-in-out;
transition: all 0.8s ease-in-out;
}

p#rotate img:hover
{
-moz-transform: rotate(360deg);
-webkit-transform: rotate(360deg);
-o-transform: rotate(360deg);
-ms-transform: rotate(360deg);
transform: rotate(360deg);
}

Gauche


Code:
<p id="360">
ton texte
</p>
Code:
p#360 img
{
-moz-transition: all 0.2s ease-in-out;
-webkit-transition: all 0.2s ease-in-out;
-o-transition: all 0.2s ease-in-out;
-ms-transition: all 0.2s ease-in-out;
transition: all 0.2s ease-in-out;

}

p#360 img:hover
{
-moz-transition: all 0.5s ease-in-out;
-webkit-transition: all 0.5s ease-in-out;
-o-transition: all 0.5s ease-in-out;
-ms-transition: all 0.5s ease-in-out;
transition: all 0.5s ease-in-out;
-moz-transform: rotate(-360deg);
-webkit-transform: rotate(-360deg);
-o-transform: rotate(-360deg);
-ms-transform: rotate(-360deg);
transform: rotate(-360deg);
}

pierre du 31
*****

Masculin
Messages : 990
Inscrit(e) le : 08/08/2011

http://peche-lac-riviere.forumactif.fr/
pierre du 31 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Effet rotatif sur titre des forums

Message par Lucas.Y le Dim 11 Aoû 2013 - 13:32

Merci Mais cela ne fonctionne pas :/

Lucas.Y
*

Féminin
Messages : 38
Inscrit(e) le : 05/07/2013

http://littlestars.forumactif.org/
Lucas.Y a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Effet rotatif sur titre des forums

Message par pierre du 31 le Dim 11 Aoû 2013 - 17:37

essaye ceci:
Code:
<p id="360">
<img src=" URL DE TON IMAGE ">
</p>

Code:
p#360 img
{
-moz-transition: all 0.2s ease-in-out;
-webkit-transition: all 0.2s ease-in-out;
-o-transition: all 0.2s ease-in-out;
-ms-transition: all 0.2s ease-in-out;
transition: all 0.2s ease-in-out;
 
}
 
p#360 img:hover
{
-moz-transition: all 0.5s ease-in-out;
-webkit-transition: all 0.5s ease-in-out;
-o-transition: all 0.5s ease-in-out;
-ms-transition: all 0.5s ease-in-out;
transition: all 0.5s ease-in-out;
-moz-transform: rotate(-360deg);
-webkit-transform: rotate(-360deg);
-o-transform: rotate(-360deg);
-ms-transform: rotate(-360deg);
transform: rotate(-360deg);
}
ou:
Code:
<p id="rotate">
<img src=" URL DE TON IMAGE">
</p>
Code:
p#rotate img
{
-moz-transition: all 0.8s ease-in-out;
-webkit-transition: all 0.8s ease-in-out;
-o-transition: all 0.8s ease-in-out;
-ms-transition: all 0.8s ease-in-out;
transition: all 0.8s ease-in-out;
}
 
p#rotate img:hover
{
-moz-transform: rotate(360deg);
-webkit-transform: rotate(360deg);
-o-transform: rotate(360deg);
-ms-transform: rotate(360deg);
transform: rotate(360deg);
}

pierre du 31
*****

Masculin
Messages : 990
Inscrit(e) le : 08/08/2011

http://peche-lac-riviere.forumactif.fr/
pierre du 31 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Effet rotatif sur titre des forums

Message par Lucas.Y le Dim 11 Aoû 2013 - 17:48

Ce n'est pas une image, c'est un texte le titre de mon forum ! Désolé pour ce qui pro quo :/

Lucas.Y
*

Féminin
Messages : 38
Inscrit(e) le : 05/07/2013

http://littlestars.forumactif.org/
Lucas.Y a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Effet rotatif sur titre des forums

Message par pierre du 31 le Dim 11 Aoû 2013 - 17:51

Je pense pas que un texte puisse pivoter, ou alors pas totalement. Je vais chercher sur internet et je vous dis si c'est possible, si un membre à une autre idée .


Edit: j'ai trouvé ça :

Code:
<style type="text/css">
<!--
td.accueil {
-webkit-transform: rotate(-5deg);
-moz-transform: rotate(-5deg);
-ms-transform: rotate(-5deg);
-o-transform: rotate(-5deg);
transform: rotate(-5deg);
text-decoration: none;
}
td.accueil:hover {
-webkit-transform: none;
-moz-transform: none;
-ms-transform: none;
-o-transform: none;
transform: none;
text-decoration: none;
}
-->
</style>
<table>
  <tr>
    <td class="accueil">Accueil</td>
  </tr>
</table>

pierre du 31
*****

Masculin
Messages : 990
Inscrit(e) le : 08/08/2011

http://peche-lac-riviere.forumactif.fr/
pierre du 31 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Effet rotatif sur titre des forums

Message par Lucas.Y le Dim 11 Aoû 2013 - 18:12

Ca ne fonctionne pas non plus :/

Lucas.Y
*

Féminin
Messages : 38
Inscrit(e) le : 05/07/2013

http://littlestars.forumactif.org/
Lucas.Y a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Effet rotatif sur titre des forums

Message par Matriochka le Sam 17 Aoû 2013 - 11:46

Bonjour,

Où en est votre problème ? S'il est résolu, merci de le signaler. Sinon, pensez à remonter votre sujet régulièrement sans quoi celui-ci sera considéré comme abandonné et envoyé à la corbeille.

Bonne journée

Matriochka
+ Hyperactif +

Messages : 7604
Inscrit(e) le : 14/07/2010

Matriochka a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Effet rotatif sur titre des forums

Message par Lucas.Y le Dim 18 Aoû 2013 - 21:37

Toujours pas résolu, Up !

Lucas.Y
*

Féminin
Messages : 38
Inscrit(e) le : 05/07/2013

http://littlestars.forumactif.org/
Lucas.Y a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Effet rotatif sur titre des forums

Message par Invité le Dim 18 Aoû 2013 - 21:59

Bonsoir,

As-tu essayé d'appliquer l'effet sur a.forumlink:link et a.forumlink:hover ? Chez moi, ça fonctionne nickel ^.^

Invité
Invité


Invité a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Effet rotatif sur titre des forums

Message par Neptunia le Lun 19 Aoû 2013 - 1:02

Coucou !

Si le premier code avait fonctionné, vous n'auriez rien vu.
Une rotation de 360° représentant un tour complet.

Imaginez que vous avancez de 12h les aiguilles d'une horloge !
1h = 30°, 12h = 360°

Neptunia
+ Hyperactif +

Féminin
Messages : 10950
Inscrit(e) le : 08/08/2010

http://www.planet-series.com/
Neptunia a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Effet rotatif sur titre des forums

Message par Lucas.Y le Mar 20 Aoû 2013 - 20:07

Bah justement je veux une rotation de 360° mais qui se voit !

Lucas.Y
*

Féminin
Messages : 38
Inscrit(e) le : 05/07/2013

http://littlestars.forumactif.org/
Lucas.Y a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Effet rotatif sur titre des forums

Message par Matriochka le Lun 26 Aoû 2013 - 9:23

Bonjour,

Où en est le problème ? S'il est résolu, merci de nous le signaler. Sinon, pensez à remonter régulièrement votre sujet sans quoi celui-ci sera considéré comme abandonné et envoyé à la corbeille.

Bonne journée

Matriochka
+ Hyperactif +

Messages : 7604
Inscrit(e) le : 14/07/2010

Matriochka a été remercié(e) par l'auteur de ce sujet.

Voir le sujet précédent Voir le sujet suivant Revenir en haut


Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum