jQuery 是一个快速、小巧且功能丰富的 JavaScript 库,它简化了 HTML 文档遍历、事件处理、动画和 Ajax 交互。jQuery 的加载效果通常指的是通过 jQuery 实现的各种动画效果,如淡入淡出、滑动、缩放等。
fadeIn()
, fadeOut()
, fadeToggle()
slideDown()
, slideUp()
, slideToggle()
animate()
show()
, hide()
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>jQuery 加载效果示例</title>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<style>
#box {
width: 100px;
height: 100px;
background-color: red;
display: none;
}
</style>
</head>
<body>
<button id="btn">点击显示/隐藏</button>
<div id="box"></div>
<script>
$(document).ready(function() {
$('#btn').click(function() {
$('#box').fadeIn(1000, function() {
// 动画完成后执行的回调函数
console.log('动画完成');
});
});
});
</script>
</body>
</html>
$(document).ready()
。stop()
方法停止当前正在进行的动画。通过以上内容,你应该对 jQuery 的加载效果有了全面的了解,并且能够解决一些常见问题。