实现如下效果:当鼠标移动到图片上是图片有类似于放大镜放大的效果

transition : CSS属性  时间 
当transition中监测的css属性发生变化时,会触发动画
.img_box img{
cursor: pointer;
transition: all .3s;
-webkit-transition: all .3s;
}
.img_box img:hover{
transform: scale(1.1);
-ms-transform: scale(1.1); /* IE 9 */
-webkit-transform: scale(1.1); /* Safari and Chrome */
}

常见二维变化除了放大 scale( ) 还有旋转 rotate(30deg)

CSS3 过渡动画的更多相关文章

  1. css3过渡动画 transition

    transition CSS3 过渡是元素从一种样式逐渐改变为另一种的效果. 要实现这一点,必须规定两项内容: 指定要添加效果的CSS属性 指定效果的持续时间 例如 这是下面代码的预览界面预览界面 & ...

  2. CSS3过渡动画&关键帧动画

    一.过渡动画 过渡(transition)动画,就是从初始状态过渡到结束状态这个过程中所产生的动画. 所谓的状态就是指大小.位置.颜色.变形(transform)等等这些属性. Note:不是所有属性 ...

  3. css3贝塞尔曲线过渡动画速率——transition-timing-function:cubic-bezier(n,n,n,n)

    css3过渡动画速率用到的是三阶贝塞尔曲线,曲线有四个点,p0,p1,p2,p3 有几个属性: linear 规定以相同速度开始至结束的过渡效果(等于 cubic-bezier(0,0,1,1)). ...

  4. css3中动画(transition)和过渡(animation)详析

    css3中动画(transition)和过渡(animation)详析

  5. CSS3过渡、变形和动画

    1.CSS3过渡 所谓CSS3过渡,就是使用CSS3让元素从一种状态慢慢转换到另一种状态.如鼠标的悬停状态就是一种过渡.如下例子: #content a{     text-decoration: n ...

  6. CSS3学习(CSS3过渡、CSS3动画)

    CSS3过渡:transition属性--专门应对颜色.长度.宽度.位置等变化的过渡 通过CSS3,我们可以在不使用Flash和JavaScript的情况下,为当前某元素从某样式改变为某样式的时候添加 ...

  7. 从零开始学习前端开发 — 15、CSS3过渡、动画

    一.css3过渡 语法: transition: 过渡属性 过渡时间 延迟时间 过渡方式; 1.过渡属性(transition-property) 取值:all 所有发生变化的css属性都添加过渡 e ...

  8. CSS3 过渡、动画、多列、用户界面

    CSS3 过渡.动画.多列.用户界面 transition过渡 transition: transition-property transition-duration transition-timin ...

  9. CSS3过渡与动画

    一.CSS3 过渡 transition-property 规定过渡效果的 CSS 属性名 -webkit-transition-property: none / all / property; -m ...

随机推荐

  1. 【性能测试】使用ab做Http性能测试

    [[TOC]] Http性能测试工具 ab(ApacheBench) 安装: yum install httpd 使用 ab -n 20 -c 1 192.168.35.1:8988/fortest ...

  2. 写在vue总结之前(二)

    都说要快速学会一个技术(会使用),比如一个框架,在实际的工作中做相关的项目是最快的学习方式.而为什么在实际的工作项目中去学习是最快的方式?个人的体会是,在实际的工作项目中,很多功能的实现是你不得不做的 ...

  3. chrome 抓包的小功能--preserve log (记录页面跳转后,所有的抓包记录)

    1.记录页面跳转后,所有的抓包记录,勾上

  4. load() 方法

    jQuery ajax - load() 方法 $("button").click(function(){ $("div").load('demo_ajax_l ...

  5. tar -zxvf中的z是个什么鬼

    习惯了tar -czvf和tar -zxvf.今天在本地用压缩软件7z打了一个tar包,在docker容器中用tar -zxvf怎么都解压不了,报错gzip: stdin: not in gzip f ...

  6. SCCM2012 R2实战系列之四:初始化配置

    在之前的文章中,我们已经完成了SCCM 2012 R2 独立主站点的部署.为了客户端代理软件的顺利安装和OSD操作系统的分发,我们需要配置组策略及DHCP服务.在本系列的第四部分,跟大家一起分享下如何 ...

  7. c#day04从控制台获取一个字符

    class EnumStruct { //定义QQ的状态枚举 Qme QnLine OffLine Leave Busy //提示用户现在一个状态 然后接收 ,并将用户输入转换成枚举类 enum Qs ...

  8. 03-String常用方法

    1.获取方法 /* * 编辑:刘诗华 int length() 获取字符串的长度 char charAt(int index) 获取特定位置的字符 (角标越界) int indexOf(String ...

  9. MySql 引擎

    存储引擎: 存储引擎就是指表的类型以及表在计算机上的存储方式 它处于MySQL体系架构中Server端底层,是底层物理结构的实现,用于将数据以各种不同的技术方式存储到文件或者内存中,不同的存储引擎具备 ...

  10. Windows下sbt安装配置

    1.下载sbt1.2.8 官网:https://sbt-downloads.cdnedge.bluemix.net/releases/v1.2.8/sbt-1.2.8.tgz 2.配置环境 #SBT_ ...