Image rotative via bouton HTML/CSS/Java
Résolu
Nyttrom
Messages postés
183
Date d'inscription
Statut
Membre
Dernière intervention
-
Utilisateur anonyme -
Utilisateur anonyme -
Bonjour a tous, alors voilà, je vous explique vite fait comment j'en suis arrivé là :
Je suis actuellement en terminale STI2D (sin) et j'ai un site a faire pour une revue de projet. J'aimerais pour le design, avoir une sorte d'image qui tourne en fonction de la position de notre souris. Plus exactement, en fonction du lien sur lequel on se trouve.
*Moment de solitude puisque personne n'as rien compris*
Alors je vous faire une petite image
http://img4.hostingpics.net/pics/736585CCM.png
(Tout en espérant que ce soir plus clair.)
Je vous montre mon code HTML/CSS (pour le moment l'image tourne sur elle même quand on passe la souris dessus mais à ce que j'ai cru comprendre en farfouillant sur le net j'ai vu que nous aurions besoin de java alors si quelqu'un peut m'aider :D )
Le HTML :
LE CSS :
Alors si il faut du java ou quoi, j'aimerais bien qu'on m'explique ^^.
Merci beaucoup d'avance :)
*-- Oui cela rend ma signature complètement fausse mais chut ! --*
Je suis actuellement en terminale STI2D (sin) et j'ai un site a faire pour une revue de projet. J'aimerais pour le design, avoir une sorte d'image qui tourne en fonction de la position de notre souris. Plus exactement, en fonction du lien sur lequel on se trouve.
*Moment de solitude puisque personne n'as rien compris*
Alors je vous faire une petite image
http://img4.hostingpics.net/pics/736585CCM.png
(Tout en espérant que ce soir plus clair.)
Je vous montre mon code HTML/CSS (pour le moment l'image tourne sur elle même quand on passe la souris dessus mais à ce que j'ai cru comprendre en farfouillant sur le net j'ai vu que nous aurions besoin de java alors si quelqu'un peut m'aider :D )
Le HTML :
<!DOCTYPE html> <html> <head> <title>test</title> <link rel="stylesheet" href="css/principal.css"/> </head> <body> <div class="imagemenu"> <img src="images/menu2.png"/> </div> <!-- Mes liens sont gros simplement parce qu'il change d'image quand on passe la souris dessus ^^ --> <a class="about" href="page.html" onMouseOver="document.img_1.src='images/about2.png';" onMouseOut="document.img_1.src='images/about.png';"> <img class="img" name="img_1" src="images/about.png"> </a> <a class="videolive" href="page.html" onMouseOver="document.img_1.src='images/videolive2.png';" onMouseOut="document.img_1.src='images/videolive.png';"> <img class="img" name="img_1" src="images/videolive.png"> </a> </body> </html>
LE CSS :
body
{
background-color: black;
}
.imagemenu {
-moz-transition-duration:5s;
-moz-transition-timing-function:linear;
-webkit-transition-duration:5s;
-webkit-transition-timing-function:linear;
transition-duration:5s;
transition-timing-function:linear;
position: absolute;
margin-left: -200px;
margin-right: auto;
margin-top: 200px;
width: 350px;
}
.imagemenu:hover {
-moz-transform:rotate(180deg);
-webkit-transform:rotate(180deg);
transform:rotate(180deg);
}
.about
{
position: absolute;
margin-top: 480px;
margin-left: 120px;
}
Alors si il faut du java ou quoi, j'aimerais bien qu'on m'explique ^^.
Merci beaucoup d'avance :)
*-- Oui cela rend ma signature complètement fausse mais chut ! --*
A voir également:
- Image rotative via bouton HTML/CSS/Java
- Jeux java itel - Télécharger - Jeux vidéo
- Waptrick java football - Télécharger - Jeux vidéo
- Eclipse java - Télécharger - Langages
- Waptrick java voiture - Télécharger - Jeux vidéo
- Java apk - Télécharger - Langages
