我有一个圆形容器 div,其中有多个 div,沿其圆周带有文本。我需要在滚动的任一方向上沿圆周将文本 div 移入和移出视图。
我使用 d3.js 选择并设置了圆形容器 div 的样式,并将其放入一个较小的包装 div 中,overflow-y 设置为 auto。
<div id="circle-out-container-wrapper"><div id="circle-out-container"></div></div>
var radius = Math.floor(document.documentElement.clientHeight * 1.5);
d3.select('#circle-out-container-wrapper')
.style('overflow-y', 'auto')
.style('overflow-x', 'hidden')
.style('width', '80%')
.style('height', '400px')
.style('left', '0')
.style('top', '0')
.style('position', 'absolute');
d3.select('#circle-out-container')
.style('background-color', 'transparent')
.style('position', 'absolute')
.style('box-sizing', 'border-box')
.style('display', 'block')
.style('border', '1px solid #bce8f1')
.style('border-radius', '50%')
.style('width', (radius * 2) + "px")
.style('height', (radius * 2) + "px")
.style('left', Math.floor(-(radius * 5) / 3) + "px")
.style('top', Math.floor(-(radius * 2) / 3) + …Run Code Online (Sandbox Code Playgroud)