JavaScript文字倒影代码，结合CSS代码，未使用图片

发布时间：2018-08-13 15:35 所属栏目：121 来源：站长网

导读：Java Script文字倒影代码，结合CSS代码实现的效果，以前我们发表过一款带倒影效果的数字时钟，但是那个效果远远不如本文的倒影，这个大家理解的，实现的效果不一样嘛。一个是时钟，一个是倒影。下边我们一起来看看效果。演示： !DOCTYPE HTMLhtmlheadtitl

　　JavaScript文字倒影代码，结合CSS代码实现的效果，以前我们发表过一款带倒影效果的数字时钟，但是那个效果远远不如本文的倒影，这个大家理解的，实现的效果不一样嘛。一个是时钟，一个是倒影。下边我们一起来看看效果。

　　演示：

<!DOCTYPE HTML> <html><head><title>JS实现的文字倒影</title> <style> body{font-size:19px;font-family:宋体} #veryhuo{position:relative;width:328px;height:18px} </style> <script language="javascript"> function aab(){ tat=document.getElementById("veryhuo").innerHTML aaa="" ja="" for(i=19,a=20;i<58;i++,a--){ ja+="<div style='overflow:hidden;width:328px;height:1px;position:absolute;top:"+i+"px;left:0px;filter:alpha(opacity="+a+");opacity:"+(a/100)+"'><p style='margin:-"+(18-(i-18))+"px 0px 0px 0px'>"+tat+"</p></div>" } veryhuo.innerHTML+=ja } </script> <body onload="aab()"> <div id="veryhuo">欢迎访问烈火网，欢迎提出宝贵意见！<div> </body> </html><div style="text-align:center;margin:30px 0 0 0;"><hr style="color:#999;height:1px;">如不能显示效果，请按Ctrl+F5刷新本页，更多网页代码：<a href='http://www.veryhuo.com/' target='_blank'>http://www.veryhuo.com/</a></div>
提示：可修改后代码再运行!

（编辑：ASP站长网）