css3探测光圈_CSS3光圈散开提示效果

CSS3光圈散开提示效果，看DEMO，你懂的。html>

transparent

body {

background: black;

}

.wrap{

height: 500px;

}

.shan {

position: absolute;

top: 0px;

left: 0px;

right:0px;

bottom: 0px;

margin: auto;

background: rgb(255, 230, 0);

width: 100px;

height: 100px;

border-radius: 100%;

animation: show-animation 2s ease-in-out 0s infinite;

-moz-animation: show-animation 2s ease-in-out 0s infinite;

-webkit-animation: show-animation 2s ease-in-out 0s infinite;

}

@keyframes show-animation{

0%{

transform: scale(0);

-moz-transform: scale(0);

-webkit-transform: scale(0);

}

100%{

transform: scale(1);

-moz-transform: scale(1);

-webkit-transform: scale(1);

opacity: 0;

}

p {

display: inline-block;

color: #fff;

width: 100px;

height: 20px;

position: absolute;

top: 50%;

left: 50%;

margin-left: -50px;

margin-top: -10px;

}

提醒用户点击

css3探测光圈_CSS3光圈散开提示效果相关推荐

css3波浪纹路_css3线条波浪动画效果
这是一款使用CSS3 animation动画和png图片制作的css3线条波浪动画效果.该特效中,使用了3张波浪线条的png图片,以及少量的CSS代码,制作出逼真的线条波浪动画效果. 使用方法 HTM ...
html5显示字幕信息,HTML5 Placeholder实现input背景文字提示效果
本文作者html5tricks,转载请注明出处这篇文章我们来看看什么是input输入框背景文字提示效果,如下图所示: 这种效果现在网上非常的普遍流行,但大部分是使用JavaScript实现的.但in ...
HTML5 Placeholder实现input背景文字提示效果
这篇文章我们来看看什么是input输入框背景文字提示效果,如下图所示: 这种效果现在网上非常的普遍流行,但大部分是使用JavaScript实现的.但HTML5给我们提供了新的纯HTML的实现方式,不需 ...
SweetAlert – 替代 Alert 的漂亮的提示效果
Sweet Alert 是一个替代传统的 JavaScript Alert 的漂亮提示效果.SweetAlert 自动居中对齐在页面中央,不管您使用的是台式电脑,手机或平板电脑看起来效果都很棒.另外提 ...
php图片特效,css3实现图片头像扫光高亮效果
css3出来后,之前很多flash才能做的效果,现在甚至不用写一句js,单纯靠css3新增的属性就能轻松实现! css3实现图片头像扫光高亮效果,源码: 测试 *{margin:0;padding:0 ...
html5背景文字,HTML5 Placeholder实现input背景文字提示效果
这篇文章我们来看看什么是input输入框背景文字提示效果,如下图所示: 这种效果现在网上非常的普遍流行,但大部分是使用JavaScript实现的.但HTML5给我们提供了新的纯HTML的实现方式,不需 ...
ios开发 html 字体模糊效果,CSS3实现苹果手机解锁的字体闪亮效果示例
0.前言 2016年08月18日今天看到注意到苹果手机的滑动解锁,提示字上会有一道白光闪过,感觉很炫酷,所以突然就来了兴致想要做一个当鼠标放在字体上(模拟手指)时,白光一闪而过,照亮字体的效果. 1 ...
【光圈】光圈是什么意思
光圈(Aperture )又称光阑(diaphragm),是一个用来控制光线透过镜头,进入机身内感光面的光量的装置,它通常是在镜头内.表达光圈大小我们是用f值.对于已经制造好的镜头,我们不可能随意改变 ...
CSS 魔法 | 超强的文本超出提示效果
本文由阅文前端严文彬授权分享原文链接:https://juejin.cn/post/6966042926853914654 在 mac 文件管理中有这样一个小细节. 当文件名不超过一行时,完整显示, ...

css3探测光圈_CSS3光圈散开提示效果

css3探测光圈_CSS3光圈散开提示效果相关推荐

最新文章

热门文章