js实现圆环弧线导航菜单效果代码

代码语言:html

所属分类:菜单导航

代码描述:js实现圆环弧线导航菜单效果代码

代码标签: js 圆环 弧线 导航 菜单

下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开

<!DOCTYPE html>
<html lang="en" >
<head>
 
<meta charset="UTF-8">
<style>
   
@import url(https://fonts.googleapis.com/css?family=Economica:400,700);

body
{
 
background: #c0392b;
 
font-family: 'Economica', sans-serif;
 
text-transform: uppercase;
 
letter-spacing: 0.1em;
 
-webkit-backface-visibility: hidden;
}

#circle {
 
width: 400px;
 
height: 400px;
 
border-radius: 200px;
 
border: 2px solid #fff;
 
position: absolute;
 
left: -250px;
}
</style>

</head>
<body>


 
<script >
      var links = [{label: 'link1', bg: '#c0392b'},
             {label: 'link2', bg: '#16a085'},
             {label: 'link3', bg: '#8e44ad'},
             {label: 'link4', bg: '#27ae60'},
             {label: 'link5', bg: '#f3.........完整代码请登录后点击上方下载按钮下载查看

网友评论0