js滑动提示效果代码分享_javascript技巧
程序员文章站
2022-03-21 19:55:31
...
本文实例为大家分享了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里:
希望本文所述对大家学习javascript程序设计有所帮助。
推荐阅读
-
javascript suggest效果 自动完成实现代码分享_javascript技巧
-
js 文本滚动效果的实例代码_javascript技巧
-
使用原生js封装webapp滑动效果(惯性滑动、滑动回弹)_javascript技巧
-
分享一个自定义的console类 让你不再纠结JS中的调试代码的兼容_javascript技巧
-
用原生js做个简单的滑动效果的回到顶部_javascript技巧
-
js抽奖实现随机抽奖代码效果_javascript技巧
-
仿jQuery的siblings效果的js代码_javascript技巧
-
使用原生js封装webapp滑动效果(惯性滑动、滑动回弹)_javascript技巧
-
纯js实现背景图片切换效果代码_javascript技巧
-
JS仿淘宝实现的简单滑动门效果代码_javascript技巧