我正在寻找一种功能,可以将一些元素绕圆排列。
结果应该是这样的:
最佳答案
以下是一些可以帮助您的代码:
var numElements = 4,
angle = 0
step = (2*Math.PI) / numElements;
for(var i = 0; i < numElements.length; i++) {
var x = container_width/2 + radius * Math.cos(angle);
var y = container_height/2 + radius * Math.sin(angle);
angle += step;
}
它并不完整,但是应该给您一个好的开始。
更新:这实际上是可行的:
var radius = 200; // radius of the circle
var fields = $('.field'),
container = $('#container'),
width = container.width(),
height = container.height(),
angle = 0,
step = (2*Math.PI) / fields.length;
fields.each(function() {
var x = Math.round(width/2 + radius * Math.cos(angle) - $(this).width()/2),
y = Math.round(height/2 + radius * Math.sin(angle) - $(this).height()/2);
$(this).css({
left: x + 'px',
top: y + 'px'
});
angle += step;
});
演示:http://jsfiddle.net/ThiefMaster/LPh33/
这是improved version,您可以在其中更改元素计数。
关于javascript - 动态地将某些元素布置在一个圆周围,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/10152390/