在线建站培训
您的位置: 魔客吧站长论坛网页特效查看内容

jquery虚拟键盘插件

轮子 发表于 2017-8-9 19:22 | 查看:1344 | 回复:0
网站特效
效果: 其它 
脚本: jQuery特效 
201707241508.jpg


简要教程
jqKeyboard是一款jquery虚拟键盘插件。该虚拟键盘插件依赖于jquery ui,通过该插件,可以在页面中生成一个扁平风格的虚拟键盘面板。
安装
可以通过npm来安装jqKeyboard虚拟键盘插件。
npm install jq-keyboard --save                  
               
使用方法
在页面中引入jquery和jquery ui,jqkeyboard-min.js,jqk.layout.en,以及jqkeyboard.css文件。
<link rel="stylesheet" href="path/to/jqkeyboard.css" />
<script src="path/to/jquery.min.js"></script>
<script src="path/to/jquery-ui.min.js"></script>
<script src="path/to/jqkeyboard.min.js"></script>
<script src="path/to/jqk.layout.en.js"></script>                 
               
初始化插件

在页面DOM元素加载完毕之后,可以通过jqKeyboard.init();方法来实例化该虚拟键盘。
jqKeyboard.init();
               
配置参数
jqKeyboard虚拟键盘插件提供了一些可用的配置参数。
containment:DOM元素,默认的容器为body。你可以指定自己的容器元素,那样的话,虚拟键盘只能在你指定的容器中进行拖拽。
allowed:一组输入元素。该选项用于指定jqKeyboard插件监听的input元素,不在数组中的元素将不会被监听。
icon:"dark" 或 "light"。图标的颜色是暗色还是亮色。默认为亮色。
例如:
$(function () {
    "use strict";

    jqKeyboard.init({
        containment: "#field",
        allowed: ["input[type='text']", "#username-input"],
        icon: "dark"
    });
});                  
               
请点击此处下载

请先注册会员后在进行下载

已注册会员,请先登录后下载

售价: 免费    【充值金币】 
下载权限: 无下载限制    【购买VIP】