js滑动提示效果代码分享
更新时间:2016年03月10日 16:13:29 作者:我_爱编程
这篇文章主要为大家分享了js滑动提示效果代码,实现方法简单,感兴趣的小伙伴们可以参考一下
本文实例为大家分享了js滑动提示效果,供大家参考,具体内容如下
js代码漂亮的动画效果;在靠右上角:背景颜色为红,字体颜色为白色 滑动 变大 上移 缓慢渐变消失
function tishi() { $("#tishi").attr("style", "border: 1px solid #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里:
<div id="tishi" style="border: 1px solid #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程序设计有所帮助。
相关文章
JavaScript中输出信息的方法(信息确认框-提示输入框-文档流输出)
这篇文章主要介绍了JavaScript中输出信息的方法(信息确认框-提示输入框-文档流输出)的相关资料,需要的朋友可以参考下2016-06-06javascript使用for循环批量注册的事件不能正确获取索引值的解决方法
这篇文章主要介绍了javascript使用for循环批量注册的事件不能正确获取索引值的解决方法,对比分析了出现问题的代码与修改后的代码,并给出了采用闭包实现的方法,具有一定的参考借鉴价值,需要的朋友可以参考下2014-12-12
最新评论