文档章节

zoom和transform:scale的区别

mxPickle
 mxPickle
发布于 2017/09/06 10:02
字数 335
阅读 15
收藏 0

1、zoom:

  以前只是看到别人的代码中用过zoom,自己从未使用过,今天在探究ie7兼容inline-block时,发现里面提到了zoom。下面开始进行对zoom的探究。

  zoom:normal | <number> | <percentage>
    默认值:normal
    适用于:所有元素
    继承性:有
    动画性:是
    计算值:绝对长度
  取值:
    normal:
          使用对象的实际尺寸。(等同于zoom:1)
    <number>:
          用浮点数来定义缩放比例。不允许负值
    <percentage>:
          用百分比来定义缩放比例。不允许负值

  兼容性:

Zoom的字面意思是“变焦”,摄影的时候常用到的一个概念。对于web上的zoom效果,你也可以按照此概念理解。可以改变页面上元素的尺寸,属于真实尺寸。在以前,zoom可以给IE6/IE7浏览器增加haslayout, 用来清除浮动,修复一些布局上的疑难杂症等。

2、transform:scale

  transform:scale是css3变形中的缩放

  语法为:transform: scale(<x> [<y>]). 同时有scaleX, scaleY专门的x, y方向的控制。(这里不专门介绍transform:scale)
  和zoom不同,scale并不支持百分比值和normal关键字,只能是数值。而且,还能是负数,没错,负数。而zoom不能是负值!

Example:

© 著作权归作者所有

共有 人打赏支持
mxPickle
粉丝 0
博文 5
码字总数 2170
作品 0
深圳
前端工程师
CSS3实践手册

will-change 不要再使用或者去骗GPU硬件加速了,而应使用提前通知浏览器我们需要对元素做什么动画,以便浏览器提前准备合适的优化设置 注意合理使用,不能泛滥使用造成系统资源浪费,同时给浏...

前端届的科比
2015/09/03
36
0
网页缩放zoom用法

网页缩放zoom用法: function zoomhtml(){ var wid=$(window).width(),len; if(wid<1600){ len=wid/1600; console.log(wid) $("html").css("zoom",len); $("html").css({"-moz-transform":"s......

yudeboo
2017/08/10
0
0
JavaScript 图片3D展示空间(3DRoom)

一般的平面效果,通过改变水平和垂直坐标就能实现,再加上深度,就能在视觉上的产生3D(三维)的效果。 程序就是模拟这样一个三维空间,里面的图片会根据三维坐标显示在这个空间。 很久以前就...

青衫无名
2017/12/04
0
0
关于Map Chart里面Zoom效果的问题

前天看Dojo新的部件 Map Chart ,有人做过么 我看了代码, 想改变一下官方demo里那个zoom的方式 默认的是那种按照个曲线缩放的效果, 我想变成常规的, 就跟googlemap相似的那种缩放效果 哪位能指...

LiuDashen
2011/03/16
818
1
10 款强大的 jQuery 图片插件

这些jQuery的图片插件包括图片缩放、剪裁、展示等功能。 1. AJAX-ZOOM This plugin are very interesting. This is and ajax zoomer, and pan gallery, and also possibility to rotate obje......

红薯
2011/06/14
3.5K
0

没有更多内容

加载失败,请刷新页面

加载更多

HashTable

Hashtable 是一个散列表,它存储的内容是键值对(key-value)映射 Hashtable 继承于Dictionary,实现了Map、Cloneable、java.io.Serializable接口 Hashtable 的函数都是同步的,这意味着它是线...

职业搬砖20年
4分钟前
0
0
Linux系统状态查看命令1

10月23日任务 10.1 使用w查看系统负载 10.2 vmstat命令 10.3 top命令 10.4 sar命令 10.5 nload命令 查看系统负载 w命令 # 第一行:当前系统时间,系统启动时间,登录的用户,系统负载:1分钟...

robertt15
20分钟前
0
0
缓存那些事

前言 一般而言,现在互联网应用(网站或App)的整体流程,可以概括如图1所示,用户请求从界面(浏览器或App界面)到网络转发、应用服务再到存储(数据库或文件系统),然后返回到界面呈现内容...

Skqing
29分钟前
0
0
nginx开启stub_status模块配置方法

nginx开启stub_status模块配置方法 2017年12月13日 15:57:29 ly_dengle 阅读数:3765 标签: stub_statusnginxnginx开启stub_status模块 更多 个人分类: 软件工具php 版权声明:本文为博主原...

linjin200
35分钟前
3
0
挑逗 Java 程序员的那些 Scala 绝技

有个问题一直困扰着 Scala 社区,为什么一些 Java 开发者将 Scala 捧到了天上,认为它是来自上帝之吻的完美语言;而另外一些 Java 开发者却对它望而却步,认为它过于复杂而难以理解。同样是 ...

joymufeng
38分钟前
94
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部