js滑动提示效果代码分享
本文实例为大家分享了js滑动提示效果,供大家参考,具体内容如下
js代码漂亮的动画效果;在靠右上角:背景颜色为红,字体颜色为白色 滑动变大上移 缓慢渐变消失
functiontishi(){ $("#tishi").attr("style","border:1pxsolid#000;position:absolute;z-index:10;width:200px;height:30px;color:white;background-color:Red;border-radius:25px;-moz-border-radius:25px;text-align:center;left:70%;top:10%;display:none"); $("#tishi").show().animate({ width:'300px', height:'37px', top:'-=10px' ,opacity:'0.8' },"slow"); $("#tishi").show().animate({ top:'-=10px' ,opacity:'0.6' },"slow"); $("#tishi").show().animate({ top:'-=10px' ,opacity:'0.4' },"slow"); $("#tishi").show().animate({ top:'-=10px' ,opacity:'0.2' },"slow"); $("#tishi").show().animate({ top:'-=10px' ,opacity:'0.0' },"slow"); }
前台代码,写在body里:
<divid="tishi"style="border:1pxsolid#000; position:absolute;z-index:10;width:200px; height:30px;color:white; background-color:Red;border-radius:25px; -moz-border-radius:25px;/*老的Firefox*/ text-align:center;left:70%; top:10%; display:none">请完善信息</div>
希望本文所述对大家学习javascript程序设计有所帮助。