zoom和scale这两个东西都是用于对元素的缩放,一下是其中一些区别:

1、scale的缩小是以图片的中心,zoom的缩小是以图片的左上角。

2、zoom的缩放改变了元素占据的空间大小;而scale的缩放占据的原始尺寸不变,页面布局不会发生变化;

3、注意:如果给zoom赋值两次,会使zoom的最终值为二者的乘积

关于zoom的一些变态用法:

1、如果zoom与position共同使用 的话,在zoom上的相对距离就不用再手动乘以zoom的比例了,页面会自动计算,做相对位置的

2、在用js给zoom赋值的时候,不能与css样式表里初始赋值相同,否则会无效

最后,zoom在手机端的有些应用还是挺好用哒~

scale 和 zoom,以及zoom的一些变态用法的更多相关文章

  1. zoom,zoom与haslayout的关系,zoom与transform: scale( )的区别

    1.zoom:(缩放)

  2. css中zoom和transform:scale的区别

    css中zoom和transform:scale的区别 关于zoom: 以前只是看到别人的代码中用过zoom,自己从未使用过,今天在探究ie7兼容inline-block时,发现里面提到了zoom.下 ...

  3. 2D转换下的zoom和transform:scale的区别

    一.什么是zoom 在我们做项目和查看别人的网页的时候总会在一些元素的样式里,看到有一个家伙孤零零的待在那里,它到底是谁呢? 它的名字叫zoom,zoom的意思是“变焦”,虽然在摄影的领域经常被提到, ...

  4. 使用d3.js的时候,如何用zoom translate scale限制拖拽范围

    红色代表需要改写的代码 1.添加定义图像大小和容器的大小及坐标 d3.behavior.zoom = function () { var moveCanvas={ width: , height: , ...

  5. 【 D3.js 进阶系列 — 6.1 】 缩放的应用(Zoom)

    缩放(Zoom)是另一种重要的可视化操作,主要是使用鼠标的滚轮进行. 1. zoom 的定义 缩放是由 d3.behavior.zoom() 定义的. var zoom = d3.behavior.z ...

  6. MKMapView and Zoom Levels: A Visual Guide

    原帖:http://troybrant.net/blog/2010/01/mkmapview-and-zoom-levels-a-visual-guide/ So, how exactly does ...

  7. d3.js v4曲线图的拖拽功能实现Zoom

    zoom缩放案例 源码:https://github.com/HK-Kevin/d...:demo:https://hk-kevin.github.io/d3...: 原理:通过zoom事件来重新绘制 ...

  8. zoom在css中的作用

    zoom:1 zoom:1;属性是IE浏览器的专有属性,Firefox等其它浏览器不支持.它可以设置或检索对象的缩放比例. 兼容IE6.IE7.IE8浏览器,经常会遇到一些问题,可以使用zoom:1来 ...

  9. 安装zoom

    ubuntu zoom下载地址:https://zoom.us/download?os=linux 安装: sudo apt-get install libxcb-xtest0 sudo dpkg - ...

随机推荐

  1. How to: Create a Business Model in the XPO Data Model Designer

    How to: Create a Business Model in the XPO Data Model Designer This topic provides step-by-step inst ...

  2. Python中lambda表达式

    一.lambda表达式形式 lambda后面跟一个或多个参数,紧跟一个冒号,以后是一个表达式.冒号前是参数,冒号后是返回值. lambda是一个表达式而不是一个语句. lambda表达式可以出现在Py ...

  3. JSONP原理及简单实现 可做简单插件使用

    JSONP实现跨域通信的解决方案. 在jquery中,我们可以通过$.ajax的dataType设置为jsonp来调用jsonp,但是jsonp和ajax的实现原理一个关系都木有.jsonp主要是通过 ...

  4. matlab的pdist函数详解

    Pairwise distance between pairs of object(Pdist函数用于各种距离的生成) 语法: D=pdist(x) D=pdist(x,distance) 解释: D ...

  5. oracle五种约束的创建和移除:

    .主键约束: 创建表的时候就添加: create table table_name (categoryId varchar2(), categoryName varchar2(), primary k ...

  6. Luogu P1273 有线电视网 树形DP

    又重构了一下...当然当初的题一看就看懂了QAQ 设f[i][j]表示以i为根的子树,有j个客户的最大收益 方程:f[u][j+k]=max(f[u][j+k],f[u][j]+f[v][k]-w(u ...

  7. CF D - Beautiful Graph(dfs 染色问题吧)给你一个图,每个节点可以赋值1,2,3三种数字,相邻的节点的和必须是奇数,问有多少中方法。

    题意: 给你一个图,每个节点可以赋值1,2,3三种数字,相邻的节点的和必须是奇数,问有多少中方法. 分析: 很容易就可以发现如果这个图中是有奇数的环的话,那这是肯定不行的 ,否则这个环的贡献是为2^s ...

  8. pyspider的基本操作

    一.安装 pip install pyspider 1.修改 pyspider/webui/webdav.py 第209行:否则启动会报错 把: 'domaincontroller': NeedAut ...

  9. PIE SDK点元素的绘制

    1. 功能简介 在数据的处理中会用到点元素的绘制,目前PIE SDK支持IMarkerSymbol的点元素的绘制,MarkerSymbol对象是用于修饰点状对象的符号,它包括ArrowMarkerSy ...

  10. Python学习 day04

    一.list list可以存放各种类型的数据,与java中list类差不多,比如li = ['keith', 1, True, [1, 2, 3], {name: 'tangtang', age: 1 ...