NinjaRadial - 漂亮的弹出圆圈放射式菜单插件

NinjaRadial - 漂亮的弹出圆圈放射式菜单插件2432
这是一个很好的放射式菜单插件,用在你的网站或者管理系统种。为什么用这个插件?+ 很容易实现+ 简单和干净的风格+ 高度可定制的+ 在任何位置使用它如何开始 ?1. 引用jquery库.
<script src="jquery-1.11.3.min.js" type="text/javascript"></script>
2. 引用插件的js.css
<link href="NinjaRadial.css" rel="stylesheet" type="text/css" /><script src="NinjaRadial.js" type="text/javascript"></script>
3. 配置您的按钮创建一个对象数组
//-- 这是基本用法buttonsModel = new Array();buttonsModel.push({ text: "Edit", click: function (e, obj) { alert("Edit: " + obj.id); } });buttonsModel.push({ text: "Remove", click: function (e, obj) { alert("Remove: " + obj.id); } });buttonsModel.push({ text: "Add", click: function (e, obj) { alert("Add: " + obj.id); }});
5. 然后调用所需的选项 .
$("#ninjaRadial").ninjaGridPlus({     buttons: buttonsModel});
按钮选项
{     //-- 这是按钮标签     text: 'Edit'      //-- 可选地,设置一个自定义字体图标样式,或者您也可以使用您自己的图标,表单 ...     cssIcon: 'fa fa-pencil'      //-- 可选地,您可以设置一个css类标签按钮 ...     cssLabel: 'editLabel'      //-- 设置回调函数,用户点击每个按钮可以调用一个函数 ...     click: 'function (e, obj) { alert("Edit: " + obj.description); }'}
{     //-- 这是背景容器大小(以像素为单位)     buttons: buttonsModel     //-- 您可以更改背景容器的大小(以像素为单位)     innerSize: 100      //-- 这是背景容器边框大小(以像素为单位)     borderSize: 10      //-- 像素中心之间的距离和按钮     distance: 60      //-- 容器改变背景颜色     backColor: 'rgba(20,20,20,0.7)'      //-- 改变背景容器边框颜色     borderColor: 'rgba(20,20,20,0.1)'      //-- 你可以设置按钮的高度(以像素为单位)     itemHeight: 40      //-- 你可以设置按钮的宽度(以像素为单位)     itemWidth: 40      //--你可以设置线的高度(以像素为单位)     lineHeight: 40}

也许你还喜欢