ie浏览器下的图片旋转问题

最新推荐文章于 2020-07-22 11:01:31 发布
最新推荐文章于 2020-07-22 11:01:31 发布
阅读量2.1k 收藏 1
点赞数
分类专栏： css 文章标签： css ie兼容 前端 css3
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_21954457/article/details/48490115
版权
在项目中遇到IE浏览器图片旋转180度的问题，发现IE的filter: DXImageTransform.Microsoft.BasicImage(rotation=2)不起作用。通过使用CSS3的transform属性，结合matrix方法成功实现旋转。代码示例如下：.rotate180{transform: matrix(-1,0,0,-1,0,0);-moz-transform: rotate(180deg);-webkit-transform: rotate(180deg);}" 117047017,10559906,理解Android Activity的创建与页面跳转,"['Android开发', 'Activity管理', 'Intent', '布局文件', '数据传递']
摘要由CSDN通过智能技术生成
今天做了一个项目，需要将图片旋转180度，可是使用ie自带过滤属性完全没效果。 
filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=2)
于是，想到用前一阵子看的css3属性中matrix方法，也算是温习一下吧。
下面，图片贴出旋转180度的代码
最低0.47元/天 解锁文章
皮卡皮卡_
关注
专栏目录
放大镜系列之三：ie8下对图片的旋转以及放大镜效果的兼容方案
tear_of_heaven的博客
12-18 844
  如果我们用上一篇文章里的方案在ie8试验一下，就会发现一些问题，一个是鼠标移动时放大镜不停的闪烁，另一个是当图片发生旋转时放大镜显示的部分不是鼠标指向的部分。   第一个问题的原因很简单，ie8下放大镜的div不是透明的，放大镜的存在，直接触发小图的鼠标mousemove事件啦。解决方法是要么加入一个监听放大镜的事件，要么把放大镜的位置放在小图的右上方（只要不遮挡小图就可以）；第二个问题的原...
IE实现图片旋转
windhawk777的专栏
01-06 1309
在网页中打开的图片需要旋转。 百度了下滤镜的用法，将代码贴出来备忘。 function openwin(url) { var OpenWindow=window.open("./" + url); //写成一行 var s = url.substring(url.lastIndexOf(".") + 1, url.length); if (s == "jpg" || s
-moz-transform:rotate()
weixin_30721077的博客
08-10 237
目前越来越多的浏览器兼容CSS3标准了，就连IE浏览器老大哥也开始向CSS3低头，微软宣布IE9浏览器支持更多的CSS3属性，IE9更注重HTML5标准。不过CSS3里有一个使对象旋转的属性transform rotate，号称兼容CSS3的浏览器对它的支持也不算好，好在Firefox、Webkit和Opera这些浏览器都已经提供了官方的hack去支持这个属性。唯独在IE浏览器里...
IE8、9、10下图片旋转
热门推荐
tang745163962的专栏
05-30 1万+
这里两天要实现一个功能，图片左右旋转 在网上找了各种zh
IE下及标准浏览器下的图片旋转（二）—— Canvas（1）
weixin_30271335的博客
12-03 116
文章过长，一篇无法保存。 IE下及标准浏览器下的图片旋转（一）——滤镜，CSS3 3.canvas canvas 是html5中的新标签，使用canvas之前我们先看下它的定义：<canvas>标签只是图形容器，您必须使用脚本来绘制图形。这个标 签是用来绘图的，包括2d和3d，拥有很多方法，因为我们只是拿来实现图片的旋转，...
图片点击放大+滚动放大+图片旋转.zip
03-27
在“兼容ie图片查看器”这部分，考虑到IE浏览器的兼容性问题，开发者可能需要使用像jQuery Rotate这样的插件来提供旋转功能。这个插件能够模拟CSS3的`rotate`效果，确保在旧版IE浏览器中也能正常工作。 最后，...
photoswipe 图片旋转实现.zip
12-18
Photoswipe是一款流行的开源轻量级图片查看库，主要用于移动端...通过阅读和理解这些代码，你可以学习如何将旋转功能集成到Photoswipe中，从而满足在PC端浏览图片时的旋转需求，同时兼容谷歌浏览器和高版本的IE浏览器。
使图片旋转的3种解决方案
12-04
图片旋转效果的研究最近在项目中需要做图片的旋转功能，我研究了...但是支持css3的浏览器只有chrome，firefox3.6 ，safari，ie浏览器是不支持的。那么IE下该怎么处理呢？于是就有了下面的一种方案 2）在IE下通过滤镜来
IE下及标准浏览器下的图片旋转（二）—— Canvas（2）
weixin_30521161的博客
12-03 149
文章过长，一篇无法保存 IE下及标准浏览器下的图片旋转（二）——Canvas（1） 同样，作为最后，我们使用使用jquery也为canvas写个旋转demo： javascript： $(function(){varw=$("#pic").width();varh=$("#pic").hei...
图片旋转支持所有浏览器
01-07
图片旋转 类似QQ空间图片现旋转 支持所有浏览器
兼容ie图片旋转jquery-rotate.js
前端搬运工的博客
07-22 281
$(document).ready(function(){ $("#foo").rotate({ angle:15, bind:{ mouseover:function(){ $(this).rotate({ ani...
IE下及标准浏览器下的图片旋转（一）——滤镜，CSS3
weixin_30410119的博客
12-03 378
关于图片的旋转，一般来说有3种解决方案：（1）滤镜（2）css3（3）canvas。接下来逐一讲解。 为了方便理解，我们主要以90度整倍数讲解，兼顾其他角度。 1.滤镜（IE专属） 1.1旋转滤镜 语法如下： filter:progid:DXImageTransform.Microsoft.BasicImage(rot...
IE8 下面通过滤镜的方式进行图片旋转
weixin_30321449的博客
12-26 198
　　首先，为什么我会提出这样的方式来进行操作呢？原因还是需求导致： 　　在做项目中，有这样一个需求，在进行网页中图片查看的时候，需要对图片的操作有支持旋转和缩放这些操作，看似这样的网上插件有很多，对！但是对于IE8 的支持都不行啊~~~因为虽然很多 插件可以在 IE8进行图片旋转，比如jquery的rotate.js 插件很好用，但是在IE8 下面进行旋转之后，就不能在进行缩放了，因为它会自动生...
IE兼容rotate旋转效果
liona_koukou的博客
12-02 3129
要在IE下实现rotate旋转效果要用到滤镜，最简单的方法可以在 http://www.useragentman.com/IETransformsTranslator/ 上面这个地址的网站可以根据你的输入生成相应的代码： 比如我在框里输入：rotate(330deg) 点击Translate to IE Matrix按钮下面会自动生成代码，复制要用的代码到我们的文件里就可以了 我只想要兼
前端解决图片在浏览器中旋转问题
zihao6的博客
10-16 5269
在开始之前需要了解为什么在浏览器中图片会自动旋转，在一些相机设备中因手持方向的原因导致图片会有一个旋转角度，在浏览器中旋转角度被忽略了，导致图片看过去是旋转的 图片旋转如下 如图 1 正常 6 旋转90° 8 旋转-90° 3 旋转180° 既然知道了图片需要旋转的角度，那么只需要通过canvas旋转并绘制图片，然后将图片输出就行，这里需要借助exif-js获取图片的源信息，只需要判断 Orie...
修复图片旋转颠倒问题的小方法
丰云 之 薪火
01-23 783
项目里有大量用户上传的文章，这些文章里有很多图片，其中一些图片的格式跟后缀名不一致。 别问我为什么，我也不知道网上怎么这么多错乱的图片。。。 这就导致一个问题：这些不正常的图片，有可能在IE浏览器上不能显示！ 没办法，我们不能强制用户做什么，只能默默的给他们插屁股。。。。 今天为此写了一个修复图片格式的方法： public static void AlterImageFo
浏览器自动旋转图片问题的解决方式
前端小口袋
05-22 4171
我们在上传拍摄照片的时候 由于手机拍摄角度问题，照片有orientation属性存储旋转角度，在显示照片时，html标签不会对旋转做处理，会导致照片自动旋转了，而使用浏览器打开，由于浏览器会对旋转属性做处理，所以看到的图片是正常的比如 浏览器中 html中 解决的方式有两个 第一种就是最简单的 给img加入属性image-orientation: from-image 这样就可以让html的照片不再旋转，不过有一些兼容性问题 可以在传送门这里看 第二种就是比较麻烦的解决方式了 使用 ...
浏览器图片上传解决方案：预览、旋转、批量上传的JS实现
2. 图片旋转：IE浏览器使用progid:DXImageTransform.Microsoft.Matrix的filter来实现图片旋转，chrome和firefox浏览器使用canvas来实现图片旋转。IE的filter可以组合使用，用空格隔开。 3. 批量上传：可以使用不...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值