jquery - slider 点 - css3 使它们沿对 Angular 线倾斜

Question

是否有一种 css3 方法可以动态地使 slider 点在对 Angular 平面中倾斜？

https://jsfiddle.net/9dtgqw95/5/

span {
  background: red;
  width: 15px;
  height: 15px;
  border-radius: 15px;
  display: inline-block;
  margin-right: 5px;
}
span:nth-child(n) {
  margin-top: 15px;
}

<div>
  <span></span><span></span><span></span>
</div>

---

如果容器被旋转——如果有更多的点，将会有定位问题

Answer 1

你可以用绝对位置推送它

div {position:relative;}
span {
  background: red;
  width: 15px;
  height: 15px;
  border-radius: 15px;
  display: inline-block;
  position: absolute;
  top:0;
}
span:nth-child(2) {
  top: 15px;
  left: 15px;
}
span:nth-child(3) {
  top: 30px;
  left: 30px;
}

<div>
  <span></span><span></span><span></span>
</div>