点击按钮对数据进行操作(2)

来源：互联网发布：seo网站分析案例编辑：程序博客网时间：2024/06/06 07:29
<!DOCTYPE html><html><head lang="en">    <meta charset="UTF-8">    <title></title>    <script type="text/javascript" src="jquery.1.12.4.js"></script>    <script>        $(function(){            $("#out").click(function(){              $("#t").slideUp();            });            $("#in").click(function(){                $("#t").slideDown(2020);            });            $("#in_out").click(function(){$("#t").slideToggle()});            $("#myShow").click(function () {                $("#topImg").show();            });            $("#myHide").click(function () {                $("#topImg").hide();            });            $("#myShowOrHide").click(function(){$("#topImg").toggle()});            $("#moveright100px").click(function(){$("#topImg").animate({"left":"100px"},3000)});            $("#moveleft100px").click(function(){$("#topImg").animate({"left":"0"},2000);});        });    </script></head><body><button id="out">淡出</button><br/><button id="in">淡入</button><br/><button id="in_out">点击我，如果隐藏就滑入|否则滑出</button><br/><button id="myShow">点击我，显示</button><br/><button id="myHide">点击我，隐藏</button><br/><button id="myShowOrHide">点击我，如果显示就隐藏|如果隐藏就显示</button><br/><button id="moveright100px">点击我，图片向右移动100px</button><button id="moveleft100px">点击我，图片向左移动100px</button><br/><br/><div id="t" style="font-size: 32px">八维学院</div><img src="dou.jpg" id="topImg" style="position: absolute"></body></html>
阅读全文
0 0