0

以下情况：

我有一个 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>

这可能吗？

我是拉斐尔的新手，这意味着我真的不知道它是否只适用于画布！

感谢您的帮助！

4

2 回答 2

2

请参考此示例代码。第一个使用拉斐尔。下一个使用 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>
于 2013-05-15T08:59:44.027 回答
0

我不认为你可以使用 raphael 函数而不使用在画布中创建图像

 Paper.image(src, x, y, w, h);

JQuery Fancybox 怎么样？

抱歉，如果我误解了您的需求。

于 2013-05-15T00:27:24.163 回答