Question

我有一个想从某一点旋转的图像。图像大小为100px x 100px。

我想在Image中的某个点左右旋转它。想想指南针。我想要旋转它的点将直接针在针的位置。因此，在我的示例中，我想将图像旋转到图像内80px左上角80px处。这是可能的还是我必须创建某种gif。

Answer 1

<div id="container"> 
    <img id="img" src="http://upload.wikimedia.org/wikipedia/commons/thumb/e/e0/Rectangle_example.svg/220px-Rectangle_example.svg.png"> 
</div> 

<script>
    $(function() {
        var src = $("#img").attr("src");
        $("#container").html("");
        var paper = Raphael($("#container")[0], 500, 500);

        var image = paper.image(src, 0, 0, 220, 130);

         $("#container").click(function() {
            image.animate({
                transform: "r360t50,50"
            }, 1000, ">");
        });
    });
</script>

您可以使用转换来获得所需的结果http://raphaeljs.com/reference.html#Element.transform

编辑：为了实现这一点，您必须使用Raphael 2

从拉斐尔的一个点旋转图像

1 个答案: