以下情况:
我有一个 raphael.js 圆圈，当我点击它时，它会弹出来。缓动效果使它看起来像一个魅力
circle = paper.circle(1000, 500, 25);
circle.click(function() {
this.animate({ r: 500 }, 1000,'super_elastic'); });
我想在图像上使用它。类似的东西
<body>
<img src="bla.jpg" id="image"/>
</body>
<script>
var image_1 = $('#image')
image_1.click(function() {
this.animate({ r: 500 }, 1000,'super_elastic'); });
</script>
这可能吗？
我是拉斐尔的新手，这意味着我真的不知道它是否只适用于 Canvas !
感谢您的帮助!
最佳答案
请引用此示例代码。 第一个使用拉斐尔。 下一个使用 jQuery。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitieal//EN">
<html>
<head>
<title>Test Raphael</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script type ="text/javascript" src="jquery.min.js" ></script>
<script type ="text/javascript" src="raphael.js" ></script>
</head>
<body>
<div id="raphael" style=""></div>
<script>
var paper = Raphael("raphael", 500, 500),
image = paper.image('bla.jpg', 0, 0, 100, 100);
image.click(function() {
this.animate({width: 500, height: 500}, 1000);
});
</script>
<div style="position:absolute; left:600px; top: 0px">
<img src="bla.jpg" id="image" width="100" height="100"/>
</div>
<script>
var image_1 = $('#image')
image_1.click(function() {
$(this).animate({
width: 500,
height: 500
}, 1000, 'linear');
});
</script>
</body>
</html>
关于javascript - 在图像上使用拉斐尔动画，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/16553375/