vue.js实现点击图标放大下离开时缩小_vue 鼠标悬浮时,图片放大,离开时图片恢复大小-程序员宅基地

技术标签: 图片变大  css样式  

@-webkit-keyframes pulse1 {
  from {
    -webkit-transform: scale3d(1.05, 1.05, 1.05);
    transform: scale3d(1.05, 1.05, 1.05);
  }

  to {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }

  /* to {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  } */
}
@keyframes pulse1 {
  from {
    -webkit-transform: scale3d(1.05, 1.05, 1.05);
    transform: scale3d(1.05, 1.05, 1.05);
  }

  to {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }

  /* to {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  } */
}

.pulse1 {
  -webkit-animation-name: pulse1;
  animation-name: pulse1;
}

@-webkit-keyframes pulse {
  from {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }

  to {
    -webkit-transform: scale3d(1.05, 1.05, 1.05);
    transform: scale3d(1.05, 1.05, 1.05);
  }

  /* to {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  } */
}

@keyframes pulse {
  from {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }

  to {
    -webkit-transform: scale3d(1.05, 1.05, 1.05);
    transform: scale3d(1.05, 1.05, 1.05);
  }

  /* to {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  } */
}

.pulse {
  -webkit-animation-name: pulse;
  animation-name: pulse;
}

.animate1 {
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}

 

版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。
本文链接:https://blog.csdn.net/xm_w_xm/article/details/84673310

智能推荐

pydicom读取头文件_.dcm格式文件软件读取及python处理详解-程序员宅基地

文章浏览阅读1.5k次。要处理一些.dcm格式的焊接缺陷图像,需要读取和显示.dcm格式的图像。通过搜集资料收集到一些医学影像,并通过pydicom模块查看.dcm格式文件。若要查看dcm格式文件,可下echo viewer 进行查看。若用过pycharm进行处理,可选用如下的代码:# -*-coding:utf-8-*-import cv2import numpyimport dicomfrom matplotlib ..._dcm 头文件信息如何获取

MySQL数据库自学快吗_MySQL数据库自学-程序员宅基地

文章浏览阅读290次。亲爱的自己和各位读者朋友:您们好!这是作者本人自学Java编程开发的一系列文章,不具有一定的权威性,也算是自己一个人的学习笔记和总结,希望自己通过博客的形式将我自己的学习效率得到提高。如自学的稳重存在不足或错误的地方希望广大的博客朋友们多多指教。本人在此不胜感激!天下数据库同属一家,可以说是兄弟关系。学习MySQL数据库可以说是一件很有趣的学习过程,就目前市场上对MySQL数据库的程序员需求量比较..._数据库好学吗

python运行加速,让你的python执行速度提升100倍,python代码加速的终极杀招,让量化回测中的行业中性计算速度起飞~~~_从硬件上提高python代码运行速度的方法-程序员宅基地

文章浏览阅读534次。前一篇文章python之快速数值计算,使用pybind11用C++为python写lib,让你的python数值计算速度提升100倍主要介绍了使用C给python写模块的一些基本知识,本篇主要借助一个例子,来看下用C来计算到底可以有多快。在多因子处理的过程中,对于因子的行业中性计算是运算量比较大,在因子处理时会花费比较多时间的一个环节。本篇就用Z-score方法来对因子进行行业中性化计算为例子,来看看到底行业中性计算可以达到什么样的速度。话不多说,先把C的计算代码框架拿出来,然后分析下行业中性化的运_从硬件上提高python代码运行速度的方法

编译hive源码时出现Missing Hive Execution Jar: /usr/local/hive/lib/hive-exec-*.jar-程序员宅基地

文章浏览阅读1.4w次。原因:出现上述问题通常是运行hive 在bin/目录下的脚本所致。详解:假设将hive 源码check out到本地hive-trunk目录,并且编译源码时没有指定"target.dir"属性,如果将HIVE_HOME变量指向hive-trunk目录,将$HIVE_HOME/bin添加到PATH变量之后。执行Hive$ hiveMissing Hive Execution Jar:_missing hive execution jar: /usr/local/hive/lib/hive-exec-*.jar

计算机辅助面访属于面访调查吗,面谈访问法-程序员宅基地

文章浏览阅读7k次。(重定向自面谈调查)面谈访问法企业在进行营销调研时,往往想知道消费者的真实感受和想法,因此很想与他们进行面对面地交谈,以此来把握市场信息,面谈访问法将为企业成功的解决这一问题。所谓面谈访问调查,就是调查员按照抽样方案中的要求,到抽选中的家庭或单位,按事先规定的方法选取适当的被访者,再依照问卷或调查提纲进行面对面的直接访问。[编辑]面谈访问法的实施入户访问是指调查员到被调查者的家中或工作单位进行访问..._计算机辅助面访

java indexof 的末尾_java indexOf() lastIndexOf() 字符串查找函数-程序员宅基地

文章浏览阅读877次。利用indexOf()匹配字符串返回 String 对象内第一次出现子字符串的字符位置。strObj.indexOf(subString[, startIndex])参数strObj必选项。String 对象或文字。subString必选项。要在 String 对象中查找的子字符串。starIndex可选项。该整数值指出在 String 对象内开始查找的索引。如果省略,则从字符串的开始处查找。说明..._java string indexof 字符串末尾

随便推点

200多程序员报名杨超越编程大赛 直男及肥宅更喜欢杨超越??-程序员宅基地

文章浏览阅读432次。从打嗝都能上热搜到作为唯一一个拿到“影响中国”年度人物大奖的演艺人物——杨超越。从外形上来说,杨超越本人萝莉脸,长腿,大眼睛,小高鼻,很像动漫人物。

Unity TimeLine 对Spine动画拓展_unity timeline使用spine-程序员宅基地

文章浏览阅读3.1k次。TimeLine 对Spine动画拓展因为公司需要对Spine动画特效制作时间线控制特效生成、动画、摄像机移动,故对TimeLine做了一点拓展,网上也没什么相关文章故在此记录下。Defualt Playables巨好用的插件可以自定义生成自己想要的类型 并生成对应的五篇代码 我们在代码上拓展就能实现自己想要的功能了。///show help 是否打开帮助提示 很贴心///Playable Name 自定义轨道的名字///是否创建标准的可混合的Playable选没选中,区别在于:选中,_unity timeline使用spine

Sqluldr2 libclntsh.so报错处理-程序员宅基地

文章浏览阅读885次。Sqluldr2 libclntsh.so报错处理处理报错[oracle@oracledg tmp]$ ./sqluldr2linux64.bin./sqluldr2linux64.bin: error while loading shared libraries: libclntsh.so: cannot open shared object file: No..._sqluldr2 error while loading shared libraries

JAVA基础篇 ----(1)JAVA发展史_java打包发展历史-程序员宅基地

文章浏览阅读95次。JAVA发展史文章目录JAVA发展史前言:一、JAVA发展史二、JAVA的版本历程==JAVA的版本发展史==三、JAVA的常用特性特点==1.JAVA常用特点==前言:本文转载自https://baike.baidu.com/item/java/85979一、JAVA发展史点我观看JAVA发展史(转载自百度百科)二、JAVA的版本历程JAVA的版本发展史1995年5月23日,Java语言诞生1996年1月,第一个JDK–JDK1.0诞生1996年4月,10个最主要的操作系统供应商申_java打包发展历史

php赞空间,最新QQ空间免费代码大全(赞)-程序员宅基地

文章浏览阅读696次。如何去掉qzone的那个圆圆的标志呢? 其实也不是去掉了,就是遮掉而已。 虽然也不很好看,所以也就我自己用而。 既然有人问,那么我就改几个代码出来吧? 代码写了几个有几个貌似不错的样子 大小做了下微调 挂件红色 javascript:window.top.space_addIte如何去掉qzone的那个圆圆的标志呢?其实也不是去掉了,就是遮掉而已。虽然也不很好看,所以也就我自己用而。既然有人问,那..._免费php空间

使用RobotFramework做UI、接口自动化常用库整理_robot framework watchui库-程序员宅基地

文章浏览阅读2.2k次。一、与HTTP请求相关的库requestspip install requestsrequestsLibrarypip install robotframework-requests二、与GRPC相关的库grpcpip install grpcio与grpc相关的protobufpip install protobufgrpc toolspip i..._robot framework watchui库