首页 > 代码库 > 4基本动画
4基本动画
<!DOCTYPE html><html xmlns="http://www.w3.org/1999/xhtml"><head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <style type="text/css"> div { border: 1px solid #000; padding: 5px; margin: 2px; width: 100px; position: absolute; display: none; background-color: white; } body { border: 2px dashed; } img { position: absolute; } </style> <title></title> <script src="http://www.mamicode.com/Scripts/jquery-1.8.2.min.js"></script> <script type="text/javascript"> $(function () { $("#btnHid").click(function () { // $("ul").hide(1000);//设置动画的执行时间 内置fast=200 normal=400 slow=600 //2.设置回调函数 //$("ul").hide(1000, function () { // $(this).show(3000); //}); //3递归 showHide(); }); }); var times = 0; //用递归实现掩藏 显示 function showHide() { if (times < 3) { $("ul").toggle(3000, showHide); times++; } } </script></head><body> <input type="button" value="http://www.mamicode.com/测试" id="btnHid" /> <ul> <li content="广州小蛮腰1">广州小蛮腰1</li> <li content="广州小蛮腰2">广州小蛮腰2</li> <li content="广州小蛮腰3">广州小蛮腰3</li> <li content="广州小蛮腰4">广州小蛮腰4</li> <li content="广州小蛮腰5">广州小蛮腰5</li> </ul></body></html>
声明:以上内容来自用户投稿及互联网公开渠道收集整理发布,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任,若内容有误或涉及侵权可进行投诉: 投诉/举报 工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。