css样式怎么来做闪光字?

html-css011

css样式怎么来做闪光字?,第1张

做闪光字可以用js代码来实现,纯css代码是很难实现的。JavaScript代码如下:

<div id="abc">这里是闪光的字</div>

<script>

var i=0

function shine(id){

var obj= document.getElementById(id)

if(i==0){obj.style.color="#000"i=1}else{obj.style.color="red"i=0}

}

setInterval("shine('abc')",100)

</script>

最近在用element ui做后台管理系统,左侧菜单比较多了,所以需要拉动网页滚动条才可以看完整个菜单,

所以就把顶部导航浮动 fixed后 到一定高度就浮动起来,

但是中途遇到一个大坑,就是在浏览器中,滚动发高度刚好在导航需要浮动的高度山下不断 上下滑动滚动条的时候 ,页面会出现不断的闪烁,不知道大家有没有遇到个这样的bug

好了 不批话多了,直接看解决方法

重点来了。。。。。。。。

尼玛重点在那点啊。。

接到往下来 就是在我浮动的导航div外面在包一层div 就觉得了

javasript代码

<divid="blink">闪烁的文字</div>

<scriptlanguage="javascript">

functionchangeColor(){

varcolor="#f00|#0f0|#00f|#880|#808|#088|yellow|green|blue|gray"

color=color.split("|")

document.getElementById("blink").style.color=color[parseInt(Math.random()*color.length)]

}

setInterval("changeColor()",200)

</script>

css代码就是文字闪烁text-decoration:blink不过很可惜,IE、Chrome或Safari不支持"blink"属性值,所以只有在Firefox和Opera下支持这CSS实现在闪动效果。加上js代码就可以了。