JQuery基础动画效果
| 属性名 | 属性说明 |
|---|---|
| show(speed,fn) | 显示元素 |
| hide(speed,fn) | 隐藏元素 |
| toggle(speed,fn) | 1.使显示元素隐藏2.使隐藏元素显示 |
参数1：动画效果持续时间。单位：毫秒
参数2：动画效果完成后执行的函数，可不写
代码示例：
<script type="text/javascript" src="../js/jquery-3.3.1.js" ></script>
<script>
function run1(){
var picture = $("#picture");
picture.hide(2000);
}
function run2(){
var picture = $("#picture");
picture.show(2000);
}
function run3(){
var picture = $("#picture");
picture.toggle(2000);
}
</script>
</head>
<body>
<img id="picture" src="../img/1.jpg" />
<button onclick="run1()">点击隐藏图片</button>
<button onclick="run2()">点击显示图片</button>
<button onclick="run3()">显示/隐藏图片</button>
</body>
| 属性名 | 属性说明 |
|---|---|
| slideDown(speed,fn) | 显示元素 |
| slideUp(speed,fn) | 隐藏元素 |
| slideToggle(speed,fn) | 1.使显示元素隐藏2.使隐藏元素显示 |
代码参考上例
| 属性名 | 属性说明 |
|---|---|
| fadeIn(speed,fn) | 显示元素 |
| fadeOut(speed,fn) | 隐藏元素 |
| fadeToggle(speed,fn) | 1.使显示元素隐藏2.使隐藏元素显示 |
代码参考上例
