jQuery自渲染键盘插件keyboard.js

 查看演示  website  立即下载

此为 jquery 键盘插件，使用很简单。（可能有些欠缺，需要大家宝贵意见，所以不用jq币了，大家多多留言意见啊）

$('.keyboard').keyboard(opts);

即可把一个盒子变成键盘

如上 opts为参数，json格式，可不填，具体参数值如下

width:p($obj.css('width')),//键盘宽度
radius:4,//键盘四角的圆角度数
padding:10,//键盘四周空白区域宽度
segment:4,//键盘左中右之间分割线宽度
FbuttonHeight:2,//第一排F区域按键与第二行之间的距离
keyWidth:0,//按钮宽度
keyHeight:0,//按钮高度
keyRadius:4,//每个按钮四角的圆角度数
keyFontSize:12,//按钮上字体大小
keyPassColor:'#fff',//按钮按下时的字体颜色
keyMargin:1,//每个按钮四周留空的距离
keyBorderWidth:1,//每个按钮的边线宽度
keyBorderColor:'#fff',//每个按钮的边线颜色
keyColorShadow:5,//每个按钮的阴影扩散度
keyDoubleFontSize:12,//两行字的按钮上字体大小
keyDoubleSegment:4,//两行字的按钮上 上下两行间距
lightRad:3,//指示灯半径
lightBorderColor:'#cdcd00',//指示灯边线颜色
lightBorderWidth:1,//指示灯边线宽度
lightColor:'#ccc',//指示灯颜色
lightColorShow:'#ff0',//指示灯灯光颜色
keyColors:['rgb(0, 255, 100)','rgb(255, 225, 0)','rgb(255, 100, 0)','rgb(255, 0, 75)','rgb(150, 0, 255)','rgb(0, 150, 255)'],//按钮颜色
keyColorsRun:true,//是否开启按钮颜色移动变化
keyColorsRunTimes:1000,//按钮颜色移动变化频率(毫秒)
boardColors:['rgb(0, 255, 100)','rgb(255, 225, 0)','rgb(255, 100, 0)','rgb(255, 0, 75)','rgb(150, 0, 255)','rgb(0, 150, 255)'],//键盘内阴影颜色
boardColorsShow:true,//是否显示键盘背景内阴影
boardColorsRun:true,//是否开启键盘背景内阴影播放，不开启默认显示第一个颜色
boardColorsRunType:'random',//键盘内阴影播放方式'random' 随机播放 'order' 按顺序播放
boardColorsInsetSize:200,//键盘内阴影大小
boardColorsRunTimes:1500,//键盘内阴影播放频率(毫秒)
keyAfterToRunTime:8000,//按键结束后多少秒自动开启默认播放动作
audio:'',//按键声音路径
keyREffect:true,//是否开启按键四射特效
keyREffectTimes:3//按键特效速度，越小越快

PREVIOUS:
NEXT:
jQuery响应式网页音乐播放插件
百度地图路书 （轨迹回放功能）