记录一个公用的css实现图片的放大缩小

@keyframes scaleDraw {  /*定义关键帧、scaleDrew是需要绑定到选择器的关键帧名称*/
0%{
transform: scale(1); /*开始为原始大小*/
}
25%{
transform: scale(1.5); /*放大1.1倍*/
}
50%{
transform: scale(1);
}
75%{
transform: scale(1.5);
}
} .showImg {
width: 20px;
height: 20px;
animation: scaleDraw 5s ease-in-out infinite;
}
<img src=""  class="showImg " alt="">

用css3实现图片的放大缩小的更多相关文章

  1. Android 本地/网路下载图片实现放大缩小

     Android 本地加载/网路下载图片实现放大缩小拖拉效果,自定义控件. package com.example.ImageViewCustom; import android.app.Activi ...

  2. JS控制图片拖动 放大 缩小 旋转 支持滚轮放大缩小 IE有效

    <html> <head>     <title>图片拖动,放大,缩小,转向</title> <script type="text/ja ...

  3. JS中图片的放大缩小没反应

    这段代码无反应: 代码如下: <script type="text/javascript"> onload = function () { document.getEl ...

  4. jquery 实现点击图片居住放大缩小

    该功能是基于jquery实现的,所以 第一步则是引入jquery jquery下载地址:https://jquery.com/download/ 或者使用此时调试的版本(3版本) /*! jQuery ...

  5. Android DIY之路 (一) 指定区域多图片合成 放大 缩小 镜像 旋转 等(转)

    惯例先看效果图 // 注意做类似这种模板功能时候 方位由后台数据提供,这里我们用假数据 4个点 或者xy 加区域来做示例 //一开始我们公司用的是透明盖住 操作图片 但发现 局限性较大.后来直接限定区 ...

  6. Java界面程序实现图片的放大缩小

    Java界面程序实现图片的放大缩小.这个程序简单地实现了图片的打开.保存.放大一倍.缩小一倍和固定缩放尺寸,但是并没有过多的涵盖对图片的细节处理,只是简单地实现了图片大小的放缩. 思维导图如下: 效果 ...

  7. Android 图片的放大缩小拖拉

    package com.example.ImageView; import android.annotation.SuppressLint; import android.content.Contex ...

  8. [jQuery]地图浏览:如何实现图片的放大缩小和点击之后的位置居中

    HTML代码: <!DOCTYPE html> <html> <head> <script src="http://ajax.googleapis. ...

  9. Android多点触控技术,实现对图片的放大缩小平移,惯性滑动等功能

    首先推荐一下鸿洋大大的打造个性的图片预览与多点触控视频教程,这套教程教我们一步一步实现了多点触控实现对图片的平移和缩放的功能.这篇文章我将在鸿洋大大的基础之上做了一些扩展功能: 1.图片的惯性滑动 2 ...

随机推荐

  1. mysql my.ini 性能调优

    MYSQL服务器my.cnf配置文档详解 硬件:内存16G [client] port = 3306 socket = /data/3306/mysql.sock [mysql] no-auto-re ...

  2. MVC的异步模式

    [小家Spring]高性能关键技术之---体验Spring MVC的异步模式(Callable.WebAsyncTask.DeferredResult) 基础使用篇 https://blog.csdn ...

  3. Storm 重启排查

    Storm实战常见问题及解决方案 https://www.cnblogs.com/catkins/p/5302634.html Storm 重启排查(续) https://www.iteye.com/ ...

  4. PAT Basic 1017 A除以B (20) [数学问题-⼤整数运算]

    题目 本题要求计算A/B,其中A是不超过1000位的正整数,B是1位正整数.你需要输出商数Q和余数R,使得A = B * Q + R成⽴. 输⼊格式: 输⼊在1⾏中依次给出A和B,中间以1空格分隔. ...

  5. 创建Git仓库

    创建Git仓库 一.什么是版本仓库 什么是版本库呢?版本库又名仓库,英文名repository,你可以简单理解成一个目录,这个目录里面的所有文件都可以被Git管理起来,每个文件的修改.删除,Git都能 ...

  6. 蓝桥杯 Car的旅行路线 (预处理+最短路径)

    https://www.luogu.org/problem/P1027 题目描述 又到暑假了,住在城市A的Car想和朋友一起去城市B旅游.她知道每个城市都有4个飞机场,分别位于一个矩形的4个顶点上,同 ...

  7. E、阔力梯的树

    题:https://ac.nowcoder.com/acm/contest/4010/E?&headNav=acm 分析:dsu.贪心方法:考虑插入一个值x,对总体贡献,若查找在序列中左边有值 ...

  8. iOS 自定义UITabBar

    推荐一篇非常好的集成各种UITabBar的三方库 <点击这里直取demo> 另外一篇根据runtime定制了一款可以出轨的UITarBar <Runtime实战之定制TabBarIt ...

  9. 十、linux-mysql下的mysql数据库增量恢复

    1.全量备份 全量数据就是数据库中所有的数据,全量备份就是把数据库中所有的数据进行备份. 备份所有库: mysqldump -uroot -ppoldboy -S /data/3306/mysql.s ...

  10. Z变换解差分方程的思考

    问题描述 今日碰到一道差分方程的题目,如下 [ y(n + 2) - cfrac{7}{10}y(n + 1) + cfrac{1}{10}y(n) = 7x(n+2) -2 x(n + 1) ] 已 ...