Signaler

Problème pour faire tourner une image JS

Posez votre question spylller 213Messages postés dimanche 1 mars 2015Date d'inscription 11 janvier 2017 Dernière intervention - Dernière réponse le 19 oct. 2016 à 21:43 par codeurh24
Bonjour,
J'ai un problème, mon code pour faire tourner une image ne marche pas :
<body>
      	<img id="image"src="images/image.png"/>

      	<script src="jquery/jquery.js"></script>
      	<script>

			var angle = 0;
			$('#image').click(function() {
			    angle += 15;
			    $("#image").rotate(angle);
			});

		</script>
      </body>

Pourquoi ?
Merci !
Afficher la suite 
Utile
+0
moins plus
Bonsoir.

Premiere raison rotate() n'existe pas comme fonction jquery
$("#image").rotate(angle);

deuxième raison tu confond les portées des variables.
Il faut utiliser le css (de niveau 3 il me semble)

<!DOCTYPE html>
<html>
<head>
    <title>Test</title>
	<style>
		img{
			width: 200px;
			height: 200px;
		}
	</style>
	<script src="http://code.jquery.com/jquery-1.12.4.js"></script>
	<script>
	$( document ).ready(function() {
		$('img').click(function() {
			$(this).css("transform", "rotate(15deg)");
		});
	});
	</script>
</head>
	<body>
      	<img src="data:image/jpeg;base64,/9j/4AAQSkZJRgABAQEAYABgAAD/2wBDAAYEBQYFBAYGBQYHBwYIChAKCgkJChQODwwQFxQYGBcUFhYaHSUfGhsjHBYWICwgIyYnKSopGR8tMC0oMCUoKSj/2wBDAQcHBwoIChMKChMoGhYaKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCj/wAARCAAgACADASIAAhEBAxEB/8QAHwAAAQUBAQEBAQEAAAAAAAAAAAECAwQFBgcICQoL/8QAtRAAAgEDAwIEAwUFBAQAAAF9AQIDAAQRBRIhMUEGE1FhByJxFDKBkaEII0KxwRVS0fAkM2JyggkKFhcYGRolJicoKSo0NTY3ODk6Q0RFRkdISUpTVFVWV1hZWmNkZWZnaGlqc3R1dnd4eXqDhIWGh4iJipKTlJWWl5iZmqKjpKWmp6ipqrKztLW2t7i5usLDxMXGx8jJytLT1NXW19jZ2uHi4+Tl5ufo6erx8vP09fb3+Pn6/8QAHwEAAwEBAQEBAQEBAQAAAAAAAAECAwQFBgcICQoL/8QAtREAAgECBAQDBAcFBAQAAQJ3AAECAxEEBSExBhJBUQdhcRMiMoEIFEKRobHBCSMzUvAVYnLRChYkNOEl8RcYGRomJygpKjU2Nzg5OkNERUZHSElKU1RVVldYWVpjZGVmZ2hpanN0dXZ3eHl6goOEhYaHiImKkpOUlZaXmJmaoqOkpaanqKmqsrO0tba3uLm6wsPExcbHyMnK0tPU1dbX2Nna4uPk5ebn6Onq8vP09fb3+Pn6/9oADAMBAAIRAxEAPwD5phLRQNnkgMvPsVOKW5LPMwzxuZR+IzViWMsHKlTlWA7ZyF5/SopE/elsAr5gYe4ximSV5WYqxUkfIvT8KR9/m9yfMHanGNtpHfYB+uakKHcSBzvLfpikBZL/AChcjgDg9ahdix9+n0p7HcNw59/WopAeuOpzTAO4NP7gmmISRyMGlVyG6d+lID//2Q=="/>
     </body>
</html>
spylller 213Messages postés dimanche 1 mars 2015Date d'inscription 11 janvier 2017 Dernière intervention - 19 oct. 2016 à 20:56
Ah, car j'avais vu rotate() sur un forum, comme quoi faut toujours faire gaffe.
Merci beaucoup !
Répondre
Donnez votre avis
Utile
+0
moins plus
Encore un autre script pour faire tourner l'image plusieurs fois a chaque clics

	var valeurDeg = 0;
	var angle = 15;
	
	$( document ).ready(function() {
		$('img').click(function() {
			
			window.valeurDeg += window.angle;
			var valeurDeg = window.valeurDeg;
			
			$(this).css("transform", "rotate("+valeurDeg+"deg)");
		});
	});
Donnez votre avis

Les membres obtiennent plus de réponses que les utilisateurs anonymes.

Le fait d'être membre vous permet d'avoir un suivi détaillé de vos demandes.

Le fait d'être membre vous permet d'avoir des options supplémentaires.

Vous n'êtes pas encore membre ?

inscrivez-vous, c'est gratuit et ça prend moins d'une minute !