位置: 编程技术 - 正文

使图片旋转的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中函数定义有哪几种方式)

  • 印花税滞纳金如何计算日期
  • 交易性金融资产属于什么科目
  • 公司中介费收入如何纳税
  • 个体工商户注销后的责任承担问题
  • 虚开增值税立案标准
  • 资产负债表存货为负数原因
  • 单位支付给职工的一次性补助金怎么入账
  • 不动产出租属于什么收入
  • 由收款人签发,经付款人承兑
  • 生产成本物料的核算
  • 签发票据是什么行为
  • 退税收入需要缴纳所得税吗
  • 税金及附加小于应缴纳所得税是什么原因
  • 境内企业是否可以出境
  • 个人独资企业是什么类型
  • 预缴增值税预缴的城建税怎么申报
  • 企业弥补亏损的三个途径
  • 企业间拆借应收利息记哪个科目?
  • 土地平整费计入什么科目
  • 公司账户转私账
  • 收据和发票有什么区别图片
  • 预借差旅费计入其他应收款吗
  • 建筑工地仓库管理流程
  • 会计科目未付利润属于哪个科目
  • 收到投资款怎么做记账凭证
  • CENTOS7安装报错
  • jQuery+Ajax+PHP“喜欢”评级功能实现代码
  • php防止网站被攻击怎么办
  • wordpress如何使用
  • php中mysqli怎么连接数据库
  • 已计提折旧怎么计算
  • 咨询公司流程完整
  • php 字符串函数
  • 如何进入企业年报系统
  • php生成php文件
  • 外商投资合伙企业有哪些
  • 免费镜像翻转软件
  • php生成验证码代码
  • 废旧物资回收企业所得税优惠政策
  • php中的异常和错误怎么写
  • phpsql查询
  • sql实现mysql的分页功能
  • el-switch右对齐
  • php调用微信扫描二维码
  • 网站top排行榜
  • 租赁增值税发票税率
  • 工程结算期末有余额吗?
  • okhttp3源码分析
  • 简易征收3%的征收率是什么意思
  • 普票加专票超过45万怎么交税
  • 小企业长期债券投资
  • 直接材料成本总差异怎么算
  • 年终奖可以税前扣除吗
  • 银行手续费没有发票要调增吗
  • 付给第三方的差额是什么
  • 购买银行理财产品的几个必须知道
  • 小规模纳税人采用简易计税方法征收增值税
  • 为什么要把工资说的好高呢
  • 普通发票和增值发票的区别在哪里
  • 已启动申报比对异常怎样才能作废,还没过税期
  • mysql安装配置教程5.7.25
  • debian系统教程
  • window10预览版
  • xp安全模式怎么用
  • 删除默认操作系统
  • ubuntu系统如何安装
  • win8恢复出厂设置找不到恢复环境
  • 怎么制作xp系统
  • win8系统开启摄像头权限
  • 勒索病毒一般勒索多少钱
  • opengl点的绘制
  • javascript简明教程
  • javascript tr
  • android背景图片透明度alpha
  • 安卓程序切换
  • js基础
  • 广东电子税务局官网登录入口手机版
  • 如何查询公司的电话号码
  • 购买材料如何计入成本
  • 北京朝阳国家税务总局
  • 免责声明:网站部分图片文字素材来源于网络,如有侵权,请及时告知,我们会第一时间删除,谢谢! 邮箱:opceo@qq.com

    鄂ICP备2023003026号

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

    友情链接: 武汉网站建设