[jQuery] rotate and resize image
I want to resize and rotate a image by click button
resize is simple, 'animate' can do it
animate({width: '+=4'}, 0);
http://code.google.com/p/jquery-rotate/
http://wilq32.googlepages.com/wilq32.rollimage222
I tried several rotate plugin, if I rotate the image at first, and
resize, it's work, but if I resize the image at first and do the
rotate, the size will back to the origin size, any good suggestion?
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://
www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>rotate</title>
<script type="text/javascript" src="js/jquery-1.3.2.min.js"></script>
<script type="text/javascript" src="js/jquery.rotate.1-1.js"></script>
</head>
<body>
<img src="images/1.gif" name="myImg" id="myImg" /><br />
<a href="#" id="rL"><</a> <a href="#" id="add">+</a>
<script language="javascript">
<!--
$(function() {
$('#add').click(function() {
$('#myImg').animate({width: '+=4'}, 0);
return false;
});
$('#rL').click(function() {
$('#myImg').rotateLeft([angle=5]);
return false;
});
});
//-->
</script>
</body>
</html>