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程序设计有所帮助。