文字圆形排列html css,js+css 圆形/环形 排列

项目需要做个环形的导航排列，网上找到一篇详细介绍原理的文章javascript-按圆形排列DIV元素(一)---- 分析，然后尝试着把它实现了，效果图如下：

image.png

源码分享给大家哦，拿走不谢O(∩_∩)O

$(function(){

//中心点横坐标

var dotLeft = ($(".container").width()-$(".dot").width())/2;

//中心点纵坐标

var dotTop = ($(".container").height()-$(".dot").height())/2;

//起始角度

var stard = 0;

//半径

var radius = 200;

//每一个BOX对应的角度;

var avd = 360/$(".box").length+stard;

//每一个BOX对应的弧度;

var ahd = avd*Math.PI/180;

//设置圆的中心点的位置

$(".dot").css({"left":dotLeft,"top":dotTop});

$(".box").each(function(index, element){

$(this).css({"left":Math.s

本文来自互联网用户投稿，文章观点仅代表作者本人，不代表本站立场，不承担相关法律责任。如若转载，请注明出处。 如若内容造成侵权/违法违规/事实不符，请点击【内容举报】进行投诉反馈！