Zoom simple jquery

**hälskar** · 04/08/2013, 14h54

Bonjour,

Je débute en javascript et je cherche à redimensionner un cercle mais cela ne fonctionne pas.

HTML :

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
<!DOCTYPE html>
<html>
    <head>
        	<meta charset="utf-8" />
			<link rel="stylesheet" href="style.css" />
			<script type="text/javascript" src="js/jquery.js"></script>
			 <script type="text/javascript" src="js/jquery-transform.js"></script>
			 <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
			 <title>Accueil</title>
    </head>
    <body>
    	<div id="circle"></div>
    	<button id="go">&raquo; Run</button>

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
$( "#go" ).click(function() {
	$( "#circle" ).animate({zoom:10},500);
});

CSS :

Code css :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
body
{
	background-color:#000;
	color:#FFF;
	height: 100%;
	margin: 0px;
   /*padding: 0px;*/
}
 
#circle {
	margin: 0;
	margin-left: auto;
	margin-right: auto;
	margin-top: 25%;
/*	margin-top: -100px; */
    width: 10px;
    height: 10px;
    background: red;
    -moz-border-radius: 50px;
    -webkit-border-radius: 50px;
    border-radius: 50px;
}

Pourriez-vous me dire ce qui cloche dans mon code ?

Merci.

**danielhagnoul** · 04/08/2013, 23h47

Bonsoir

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
<script>
	// document ready, voir : http://api.jquery.com/ready/		
	$( function(){
 
		$( "#go" ).click(function() {
			$( "#circle" ).animate( { "zoom" : 10 }, 500 );
		});
 
	});
</script>

Zoom simple jquery

jQuery

Vue hybride

Discussions similaires

Partager

Partager