图标闪烁CSS代码

<!DOCTYPE html>

<html>

<head>

    <style>

        #markerDiv {

            position: absolute;

            float: left;

            left: 20px;

            top: 20px;

            width: 38px;

            height: 44px;

            background: url(marker.png) no-repeat;

        }

        @-webkit-keyframes flicker {

            0% {

                -webkit-transform: scale(1.2, 1.2);

            }

            50% {

                -webkit-transform: scale(.9, .9);

            }

            100% {

                -webkit-transform: scale(1.2, 1.2);

            }

        }

        @keyframes flicker {

            0% {

                transform: scale(1.2, 1.2);

            }

            50% {

                transform: scale(.9, .9);

            }

            100% {

                transform: scale(1.2, 1.2);

            }

        }

        .flicker-animation {

            animation: flicker 1.5s infinite linear;

            -webkit-animation: flicker 1.5s infinite linear;

        }

    </style>

</head>

<body>

    <div id="markerDiv" class="flicker-animation"></div>

</body>

</html>

用途

电子地图marker闪烁效果

效果图

图标闪烁CSS的更多相关文章

  1. WPF 系统托盘 图标闪烁

    WPF消息通知 系统托盘,图标闪烁 using System.Windows.Forms; using System.Windows.Threading; public partial class W ...

  2. VC 任务栏图标闪烁

    像QQ来消息时的,图标闪烁效果 将如下代码添加到Timer响应函数中 ) {// 任务栏图标闪烁 if (this != GetForegroundWindow()) { //// this-> ...

  3. FontAwesome 4.7.0 中完整的675个图标样式CSS参考

    FontAwesome 4.7.0 中完整的675个图标样式CSS参考 用法:首先引入CSS文件:<link href="https://maxcdn.bootstrapcdn.com ...

  4. CSS Icon 项目地址 小图标-用css写成的

    http://cssicon.space/#/icon/focus 这是所有用css写成的  小图标  右侧有 html和css代码

  5. C# WinForm实现任务栏程序图标闪烁

    相信大家在用QQ的时候都会知道,你打开了QQ聊天窗口,如果窗口不是当前激活的窗口的话,收到QQ消息时,任务栏(不是托盘图标)上的图标会闪一下变成黄色(Win7默认主题下),用以通知用户有消息进来了,之 ...

  6. Qt Qwdget 汽车仪表知识点拆解5 标题栏图标闪烁

    先贴上效果图,注意,没有写逻辑,都是乱动的 看下最上面的部分,有一些仪表图标在闪烁,如果一个一个写,也是可以实现的,不过感觉要累死的节奏 这里我写了一个我自己的Label,完了把把这些QLabel提升 ...

  7. 奥森图标和CSS特殊字体使用方法

    作为第一篇博文,写这个 我快要被气炸,好吧,废话不说了 昨天在项目中发现有很多这些Awesome图标 也在网上找了下Font Awesome下载后这些文件,现在的版本是4.2,Font Awesome ...

  8. openlayers 添加标记点击弹窗 定位图标闪烁

    环境vue3.0 ,地图为公用组件,将添加图标标记的方法放在公共地图的初始化方法里 同一时间弹窗和定位标识都只有一个,因而我把弹窗和定位标记的dom预先写好放到了页面 //矢量标注样式设置函数,设置i ...

  9. 又一款开源图标库 CSS.GG，值得一用

    嗨,我是 Martin,也叫老王,今天推荐一款好用的开源图标库. 我们平常找图标往往会去 iconfont 但是今天,我们看了 Martin 的文章之后,就会有一个新的选择--CSS.GG Githu ...

  10. FontAwesome 4.4.0 中完整的585个图标样式CSS参考

    做一记录,免得每次都去网上搜图标对应的class. 在线版本:http://dnt.dkill.net/dnt/font/  

随机推荐

  1. [动态树] Link-Cut Tree

    Link-Cut Tree 0x00 绪言 学长们讲 LCT 的时候,我在另一个机房摸鱼,所以没有听到,就回家看 yxc 的补了补. 0x01 什么是动态树 动态树问题, 即要求我们维护一个由若干棵子 ...

  2. EventBus 简明教程

    简介 EventBus 是一个用于 Android 和 Java 编程的 事件发布/订阅框架.使用 EventBus 进行事件传递,事件的发布和订阅就被充分解耦合,这使得编程人员从传统而原始的事件传递 ...

  3. js实现按照首字母排序

    <script type="text/javascript"> let obj = [{name:'CA'},{name:'XA'},{name:'CB'},{name ...

  4. 洛谷P2757 [国家集训队]等差子序列 （hash+线段树）

    题目连接 这题只要令 $len=3$看是否符合即可.因为是一个 $1$到 $n$的排列,考虑数列中项,那么对于一个数 $x$,令 $k=\max(n-x, x-1)$,只要存在 $d\in(1,k)$ ...

  5. Vue项目的创建、运行与端口号修改

    前言:Vue-cli是Vue官方提供的一个脚手架,用于快速生成一个Vue的项目模板,依赖于NodeJS环境 NodeJS下载:NodeJS安装下载 Vue-cli下载:Vue-cli下载 一.Vue图 ...

  6. [ARC137E] Baker

    Problem Statement Snuke runs a bakery. He is planning for the next $N$ days. Let us call these days ...

  7. Chat2DB接入文心一言AI教程（原创教程，转载请注明）

    引言 关于Chat2DB和文心一言是啥我就不赘述了,由于Chat2DB自带的ai有调用次数限制,所以想着接入百度的文心AI,但是由于网上没有找到相关的教程,此教程是本人研究了很久才弄出来的,顺便记录一 ...

  8. 封装Detours用于Python中x64函数hook

    Detours 代码仓库: https://github.com/microsoft/Detours x64写一个任意地址hook要比x86麻烦的多,所以这里直接封装框架来用于x64的hook. De ...

  9. 不会使用 EF Core 的 Code First 模式？来看看这篇文章，手把手地教你

    EF Core Code First 是什么 Code First 是 Entity Framework Core (简称 EF Core) 的一种开发模式,它允许开发人员使用纯粹的代码来定义数据模型 ...

  10. URL安全的Base64算法

    URL安全的Base64算法 base64是取3个字节(24位)的数据强行组成4个字节(32位)的数据做为一个分组,24位分成4个字节的话,每个字节分到6位,然后前面补两位0,然后这个字节的值位索引去 ...