如何使用客户端解决方案旋转图像

发布于 2024-09-12 05:54:27 字数 211 浏览 3 评论 0原文

我想知道是否有任何方法可以使用客户端解决方案动态旋转图像或反转图像？我不在乎它是否是普通的旧 javascript、jquery 插件、css。我只是想知道是否有某种方法可以在客户端动态地执行此操作，而不必为我可以执行的每个图像编写服务器端代码。

我尝试在 Google 上搜索不同的关键字，但没有找到任何内容。

编辑：我正在寻找一种不需要 HTML 5 任何内容的解决方案。

原文

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

冷弦 2024-09-19 05:54:27

Firefox、Safari 和 Opera 支持此操作：

-webkit-transform: rotate(-90deg);
-moz-transform: rotate(-90deg);
-o-transform: rotate(-90deg);
transform: rotate(-90deg);

您也可以在 IE8 中执行此操作，甚至可以在 7(?) 中执行此操作：

position: absolute;
filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=3);

使用 JS 旋转元素：

var deg = 90
$('element').style.MozTransform = 'rotate(' + deg + 'deg)';
$('element').style.WebkitTransform = 'rotate(' + deg + 'deg)';

编辑：

哇，根据 http://msdn.microsoft.com/en-us/library/ms532972%28VS.85%29.aspx 旋转适用于 IE 5.5！

Firefox, Safari and Opera support this:

-webkit-transform: rotate(-90deg);
-moz-transform: rotate(-90deg);
-o-transform: rotate(-90deg);
transform: rotate(-90deg);

you can also do this in IE8, maybe even 7(?):

position: absolute;
filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=3);

rotate an element using JS:

var deg = 90
$('element').style.MozTransform = 'rotate(' + deg + 'deg)';
$('element').style.WebkitTransform = 'rotate(' + deg + 'deg)';

edit:

wow, according to http://msdn.microsoft.com/en-us/library/ms532972%28VS.85%29.aspx the rotation works for IE 5.5!

回复收藏 0 原文

离去的眼神 2024-09-19 05:54:27

非常有趣的javascript解决方案：
http://www.stableflow.com/downloads/jquery-插件/360 度产品视图/
想象一下，您正在经营一些商店或博客，并向用户展示您的产品。该解决方案允许您节省空间并通过脚本以非常真实的形式呈现产品视图。它允许忘记闪存（仍然不是所有移动设备都支持）。
您需要使用它的是：