jQuery显示和隐藏动画
程序员文章站
2022-03-07 13:20:48
...
jQuery显示和隐藏动画
<html lang="en"><head> <meta charset="UTF-8"> <title>jQuery显示和隐藏动画</title> <style> *{ margin: 0; padding: 0; } div{ width: 200px; height: 200px; background: red; display: none; } </style> <script src="js/jquery-1.12.4.js"></script> <script> $(function () { // 编写jQuery相关代码 $("button").eq(0).click(function () { // $("div").css("display", "block"); // 注意: 这里的时间是毫秒 $("div").show(1000, function () { // 作用: 动画执行完毕之后调用 alert("显示动画执行完毕"); }); }); $("button").eq(1).click(function () { // $("div").css("display", "none"); $("div").hide(1000, function () { alert("隐藏动画执行完毕"); }); }); $("button").eq(2).click(function () { $("div").toggle(1000, function () { alert("切换动画执行完毕"); }); }); }); </script></head><body><button>显示</button><button>隐藏</button><button>切换</button><div></div></body></html>转载请注明来源，欢迎对文章中的引用来源进行考证，欢迎指出任何有错误或不够清晰的表达。可以在下面评论区评论，也可以邮件至 [email protected]
下一篇： linux内核相关-c字符数组底层处理