位置: 编程技术 - 正文

使图片旋转的3种解决方案(如何旋转图片30度)

编辑:rootadmin

图片旋转效果的研究最近在项目中需要做图片的旋转功能,我研究了一下。下面来总结下图片旋转在各个浏览器的支持情况

一、图片旋转的方案

1)css3实现图片旋转功能:支持的浏览器有chrome,firefox;opera是不支持的。

具体代码为:-moz-transfrom:rotate(deg);-webkit-ransfrom:rotate(deg);上述代码的意思就是将图片顺时针旋转度,其实可以旋转任意的度数。但是支持css3的浏览器只有chrome,firefox3.6 ,safari,ie浏览器是不支持的。那么IE下该怎么处理呢?于是就有了下面的一种方案

2)在IE下通过滤镜来实现旋转

具体代码为:filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=1);这里的rotation 参数可以为0,1,2,3 ,表示的意思就是这些数字乘以后的旋转角度。IE下如果要旋转任意的角度要用到矩阵变换滤镜,我们在日常的使用过程中,大部分使用的是变换的倍数,这里就不讨论任意的角度了。但是还是有问题的,如果非ie浏览器,不支持CSS3,那么如果实现图片的旋转呢,其实canvas也是可以图片旋转的。

3)用canvas来实现图片的旋转

canvas在chrome,firefox,opera等浏览器中均支持,他是有一个基于 JavaScript 的绘图 API,。首先我们来看看怎样利用canvas+JavaScript实现图片的旋转

代码如下:

上述代码首先得到一个canvas对象,然后设置他的高度,开始绘图了。这个改变canvas的中心点和旋转角度,然后将图片画到canvas中去,将其存储起来,然后隐藏之前的图片。这种方法实现还是比较平滑的。

二、各种方案的对比css3的实现方案,不会改变原始图片所占空间的大小的,但是ie下的滤镜会改变图片所占空间的大小。其实ie下也是可以支持canvas的,只需要引用一个canvas的脚本。这个是有google提供的一个。但是这个脚本有点大,没有压缩前有多k我比较建议在ie下使用滤镜来实现,其他的浏览器使用canvas 标签来实现。

推荐整理分享使图片旋转的3种解决方案(如何旋转图片30度),希望有所帮助,仅作参考,欢迎阅读内容。

使图片旋转的3种解决方案(如何旋转图片30度)

文章相关热门搜索词:图片能旋转怎么制作的呢?,使图片旋转的快捷键,图片旋转的三个要素,将图片设置为旋转动画效果,如何旋转图片30度,如何旋转图片30度,如何旋转图片30度,使图片旋转的快捷键,内容如对您有帮助,希望把文章链接给更多的朋友!

JS两种定义方式的区别、内部原理 相信两种方式大家都用过,但未必所有人都知道其区别,内部原理。//方式1functionfunc1(x,y){//yourcode}//方式2varfunc2=function(x,y){//yourcode}方式1是典型的函数

解析URI与URL之间的区别与联系 今天在看STRUTS配置的时候,发现一个问题,就是在看配置文件的时候,有时出现URL有时又是URI,让我心生不解,到网上查了一圈,解释都含糊不清,索性

nodeType属性返回被选节点的节点类型介绍 节点编号:节点名称:1Element2Attribute3Text4CDATASection5EntityReference6Entity7ProcessingInstrucion8Comment9DocumentDocumentTypeDocumentFragmentNotation

标签: 如何旋转图片30度

本文链接地址:https://www.jiuchutong.com/biancheng/373665.html 转载请保留说明!

上一篇:js单例模式详解实例(js中单例模式)

下一篇:JS两种定义方式的区别、内部原理(js中函数定义有哪几种方式)

  • 新办企业购置设备怎么抵税
  • 我国现行的增值税属于什么
  • 员工工作服怎么做分录
  • 融资租赁如何确认收入
  • 生产成本月末结转到本年利润里吗
  • 销售折让开具红字
  • 金税盘地区编号怎么查
  • 什么叫调表不调帐
  • 无收入证明需要哪些手续
  • 违反账簿、凭证管理要承担什么法律责任
  • 固定资产账实不符的审计定性
  • 物业前期开办物资
  • 物业公司收取电损费合法吗
  • 银行对公贷款利息多少
  • 对外贸易出口公司
  • 计划成本法下会计分录
  • 小微企业增值税申报表怎么填
  • 打井行业
  • 新建厂房装修费账务处理
  • 外商投资企业要交房产税吗
  • 下属单位或者其他单位和个人的车辆
  • 审计费可以抵扣进项吗
  • 电脑开机自动进入bios怎么解决
  • 土地 补偿
  • php oci8
  • win11测试版和正式版区别
  • 财务决算报表是谁编制的
  • 冲销去年凭证会计分录
  • js时间格式转换时间戳
  • 公司收入可以打折吗
  • 贸易公司出口退税政策最新
  • 如何进入企业年报系统
  • 开出转账支票补付款项
  • php imagecopy
  • php代码生成
  • 个体工商户年报逾期怎么办
  • 更改税种需要哪些资料
  • 相见恨晚求下联
  • 自学黑客技术入门教程
  • web自动化测试平台
  • element ui table
  • ajax调用php接口
  • 什么是对公账户和个人账户
  • 收取房屋租赁费的会计分录
  • 营业执照筹建是做什么的
  • 增值税发票认证期限最新规定
  • 发票系统技术维护费
  • sqlserver2005连接到服务器
  • 增值税现代服务业包括哪些内容
  • 单位买的空调计入什么科目
  • 企业汇算清缴中的职工薪酬指的是管理费用中的吗
  • 用友t3建账行业性质怎么选
  • 公司内部核算调研报告
  • 支付金额和实付金额的区别
  • 企业的免税收入范围
  • 购入土地使用权以什么为计税依据
  • 内账外账用一个云盘可以吗
  • 电脑算固定资产哪一类
  • 一个 sql 查询很慢,从哪些地方进行优化?
  • ubuntu14.04升级18.04
  • easybcd修复ubuntu
  • win8安全模式黑屏
  • linux 查看指定行
  • windows无法访问\\192.168.1.104
  • win8右侧栏设置
  • win8系统多少位
  • windows 8开机
  • Particle system study section 1
  • Linux中scp命令获取远程文件的方法
  • shell win10
  • div+css布局是什么
  • pycharm支持python3.9
  • android:testonly="true"
  • 每天一篇日记
  • javascript如何学
  • Android java.lang.IllegalArgumentException: pointerIndex out of range
  • Javascript字符串出现次数
  • 税务文书送达回证模板
  • 2o21年公租房
  • 财税相关书籍
  • 免责声明:网站部分图片文字素材来源于网络,如有侵权,请及时告知,我们会第一时间删除,谢谢! 邮箱:opceo@qq.com

    鄂ICP备2023003026号

    网站地图: 企业信息 工商信息 财税知识 网络常识 编程技术

    友情链接: 武汉网站建设