Jquery 使div在每个浏览器中都可旋转_Jquery_Css_Jquery Ui_Rotation

Jquery 使div在每个浏览器中都可旋转

jquery css jquery-ui

Jquery 使div在每个浏览器中都可旋转,jquery,css,jquery-ui,rotation,Jquery,Css,Jquery Ui,Rotation,首先，我看到了，但它没有给我想要的解决方案我有一个可拖动的div 因此，在divs sleep中有div的1个主div（bord）是图像，它们被缩放到div的100%宽度和高度（保持纵横比） div可调整大小并可拖动我希望图像（div）能够与右上角的处理程序一起旋转，就像右下角的resize一样目前，div板中1个已删除图像的html看起来像 <div class="ui-draggable sleep ui-resizable" style="position: absolute;

首先，我看到了，但它没有给我想要的解决方案

我有一个可拖动的div

因此，在divs sleep中有div的1个主div（bord）是图像，它们被缩放到div的100%宽度和高度（保持纵横比）

div可调整大小并可拖动

我希望图像（div）能够与右上角的处理程序一起旋转，就像右下角的resize一样

目前，div板中1个已删除图像的html看起来像

<div class="ui-draggable sleep ui-resizable" style="position: absolute; z-index: 1; left: 125px; top: 46px;">
  <img src="/imgurl.jpg" class="center">
  <div class="ui-resizable-handle ui-resizable-e" style="z-index: 90;"></div>
  <div class="ui-resizable-handle ui-resizable-s" style="z-index: 90;"></div>
  <div class="ui-resizable-handle ui-resizable-se ui-icon ui-icon-gripsmall-diagonal-se" style="z-index: 90;"></div>
</div>

我想让它在每个浏览器中都可以旋转

谁能帮我个忙吗

编辑更清晰的问题：

我希望下降的div可以像在这个站点上一样旋转：

我正在做一些看起来像那个网站的东西：我有可以删除的带有图片的div

在落下后，我希望它们可以用手柄旋转

我已使divs可放下、可调整大小和可拖动。参见上面的代码

但我不知道从何处开始旋转，这就是为什么我发布了这个问题

我没有例子，因为我不知道从哪里开始

我已经做了一个测试页面，虽然我有点生气，但效果不好

您可以单击左侧的一个图像

然后用白色边框标记，然后单击

Omhoog记录Omlaag链接以改变方向。但我希望他们用手柄而不是按钮来扭转局面

这里有600多行代码，其中大部分是php和jquery，我试着编一把小提琴，但代码太多了。所有jquery都可以在源代码中查看。

好的，斯文，我已经查看了您作为示例放置的网站，他们使用了一个名为ExtJS的库（这是支持HTML5的，因此与所有现代浏览器兼容），该库具有旋转任何元素的功能

现在，你说提供给你的解决方案与所有浏览器都不兼容，好吧，那么合并解决方案，在你发布的链接中提供了可以合并以使其与所有浏览器兼容的解决方案（似乎大多数解决方案都使用CSS，所以你在那里应该是安全的）你所要做的就是像@Jay Blanchard建议的那样努力，开始编写代码

最后，我给您的另一个解决方案（如果您不能将ExtJS库包含到项目中）是使用名为raphaeljs的Javascript库

在我看来，您可以做的是将句柄图像附加到div，获取句柄的位置（x，y），并传递元素需要旋转的程度

就代码而言，我目前没有任何代码，但如果有机会，我会在接下来的几个小时左右想出一些东西，看看CSS3转换属性，特别是功能

以下浏览器支持CSS3 2d transform的旋转功能：

IE>9
FF>3
铬>4
歌剧>10
iOS Safari>3
Android浏览器>2.1
BB浏览器>7
Opera Mobile>11
Chrome（适用于Android）
Firefox（适用于Android）

iwanttouse.com汇总了这些数据，并表示

不确定您对浏览器支持的要求是什么，但如果您想在IE中执行旋转，为什么不使用jQuery UI旋转插件：请访问-> 你可以下载插件

通过点击这个->

因为这对我来说非常有趣，因为我知道将来我可能需要这样的东西，我做了比平常更多的研究，我很高兴找到了完美的解决方案

看看这个JQuery插件

该插件不仅允许您旋转，还允许您自由变换元素，希望对您有所帮助。

您需要显示一些代码，以便我们可以帮助您修复现有的内容或引导您朝正确的方向前进。我已经公布了我所在部门的代码。有了可拖动的项目..这就是帮助您修复代码，这里的人通常不会只为您编写代码。如果你不展示你试图让它可旋转的东西，你的帖子很可能会继续被否决，而不会得到任何答案。这就是为什么我推了，有人能帮我正确的方法吗？在它下面。你能提供一个答案吗？我刚刚看了代码，蒙太奇也使用拉斐尔JS<代码>用Raphaël 2.1.0创建是的，但是他们使用svg，这是不同的方式我相信代码是由Raphael库自动生成的，你应该看看这个教程，看起来很容易集成这正是我想要的，我很高兴有人能够正确地阅读问题并给出一个明确的答案！

.draggable({stack: ".sleep", containment: '#bord' })
    .resizable
    ({containment:'#bord',aspectRatio: true})
    .css({position: 'absolute'})