快速滑动 不停切换
<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title><script src="./js/jquery.min.js"></script><style>div {width: 100px;height: 100px;background-color: pink;display: none;}</style>
</head><body><button>显示</button><button>隐藏</button><button>切换</button><button>移动切换</button><button>移动切换简化版</button><div></div><script>$(function() {$("button").eq(1).click(function() {$("div").slideUp();});$("button").eq(0).click(function() {$("div").slideDown();});$("button").eq(2).click(function() {$("div").slideToggle();});//鼠标切换$("button").eq(3).hover(function() {$("div").slideDown();}, function() {$("div").slideUp();});//stop必须放在动画的前面$("button").eq(4).hover(function() {$("div").stop().slideToggle();});});</script>
</body></html>运行结果
