<!DOCTYPE html>
<html>
<head>
<title>CSS3 水平抛物线动画</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width">
<style>
html,
body {
width: 100%;
height: 100%;
padding: 0;
margin: 0;
}
#ball {
display: none;
width: 10px;
height: 10px;
background: red;
border-radius: 50%;
position: fixed;
}
#line {
height: 100vh;
width: 1px;
background: #000;
position: absolute;
left: 500px;
}
</style>
</head>
<body>
<div id="ball"></div>
<div id="line"></div>
</body>
<script>
var ball = document.getElementById('
CSS3 利用贝塞尔曲线实现小球抛物线效果 (处理了小球起点低于终点的情况)
最新推荐文章于 2024-04-10 22:39:33 发布