fcode.js

九宫格自动锁屏 jQuery 插件
授权协议 Apache
开发语言 JavaScript
所属分类 jQuery 插件、 jQuery高级页面组件
软件类型 开源软件
地区 国产
投 递 者 璩涛
操作系统 跨平台
开源组织
适用人群 未知
 软件概览

fcode.js 自动锁屏插件

fcode-indexfcode

fcode.js是什么?

fcode.js是一款web页面九宫格自动锁屏js插件,依赖于jquery,

会在设置的范围里,判断用户有无操作,然后执行锁屏的功能。

就一个js文件,配置简单,操作方便,可以锁住任何页面,还支持在手机端的锁屏。

此外,还支持更新密码,或者用来登录,都有相关的说明,特别简单,相信您看一下,就会明白!

演示地址:http://fcphp.cn/fcode   demo请在http方式下访问

如何使用fcode?

  <script src="js/jquery.min.js"></script>
  
  <script src="js/fcode.min.js"></script>
  
  <script type="text/javascript">
      fcode.Start(123);
  </script>

因为是使用的九宫格,所以密码就是对应着数字123456789,最上面一排从左到右代表1,2,3,中间代表4,5,6,最后一排代表7,8,9 所以相应的密码也要如此设置

fcode的基本配置

fcode.js的基本配置非常简单,一看便知,便不多做介绍

   <script type="text/javascript">

        fcode.bgColor = '#FFF'; //背景颜色

        fcode.fontColor = '#666';//圆环颜色

        fcode.lineColor = "#333"; //连线的颜色

        fcode.lineErrorColor = "#00a254";//连线错误颜色

        fcode.lineSuceessColor = "#cc1c21";//连续正确颜色

        fcode.Time = 10;//锁屏的时间,单位s

        fcode.bgImage = 'images/time.jpg'; //设置背景图片,优先于背景颜色

        fcode.customHtml = 'lovefc';//定义九宫格解锁上方的html内容
        
        fcode.Start('123');//启动运行
    </script>

这里重点介绍一下fcode.Start这个函数的设置,这个函数是启动功能的,参数可以是密码,md5加密的密码,或者是一个api接口

1.普通密码形式。

 fcode.Start('123');//启动运行

这种方式,就是代表第一排滑动解锁,简单方便,缺点是能看到源码(虽然我已经屏蔽了源码查看,f12,右键查看的功能)

2.md5加密形式,其实就是把上面的123md5加密一下,是小写的md5 32位加密方式,可以随便找个工具加密一下就行了,比如用这个,http://tool.chinaz.com/tools/md5.aspx 这种方式安全多了,而且可以免去配置api接口,不需要额外的脚本就能运行

 fcode.Start('202cb962ac59075b964b07152d234b70');//启动运行

3.第三种方式就是api接口形式的了,目前只提供了php的接口参考(本人做php的),地址一定要填写完整的接口地址,例如 http://127.0.0.1/status.php

fcode.Start('http://127.0.0.1/status.php');

接口设计也是非常简单,没有什么复杂的地方,一看便知

  <?php
   /* 
    * 用来验证锁屏密码 
    * author:lovefc
    */
 
   $pwd = isset($_POST['pwd']) ? $_POST['pwd']:null;//获取传过来的密码

   $time = isset($_POST['time']) ? (int) $_POST['time'] : 60;//获取传过来的时间

  if(!empty($pwd)){
	  //比对密码,看看是否相等
	  if($pwd==1235789){
		  //设置cookies,加上时间
          setcookie("fcode_status",'lovefc', time()+$time);
		  //返会并输出ok
	      die('ok');
	  }
  }

4.兼容性说明,测试支持ie10,ie11,火狐,谷歌!

作者吐槽

不足之处 欢迎反馈

QQ:1102952084

  • 这里以基金净值画折线图为例 数据文件  660008.csv date,jz,ljjz 2016-01-04,1.1141,1.1141 2016-01-05,1.1161,1.1161 ... ... 2019-04-02,1.3440,1.3440 2019-04-03,1.3605,1.3605 2019-04-04,1.3736,1.3736 date_json.py 生成要求的 json

  • //根据文件后缀 获取base64前缀 getBase64Type (type) { switch (type) { case 'txt': return 'data:text/plain;base64,' case 'doc': return 'data:application/msword;base64,' case 'do

  • <!DOCTYPE html> <html lang="zh-CN"> <head> <meta charset="utf-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="renderer" content="webkit"> <title>抽奖</title>

  • ** JS代码质量SonarQube常见问题及解决思路 ** 示例问题: “i” hides or potentially hides a variable declared in an outer scope at line 10. Overiding a variable dedlred in an outer scope can strongliy impact th readebliy,

  • computed: { dataRule: function () { return { fCode: [/*三个验证不同的提示*/ { required: true, message: this.$t('validate.required'), trigger: 'blur' }, {

  • arr=[{ code: "001" name: "name1" desc: "描述描述描述001" }, { code: "002" name: "name2" desc: "描述描述描述002" },{ code: "001" name: "name1" desc: "123456789" }, ] functi

 相关资料
  • grid 九宫格,功能类似于微信钱包界面中的九宫格,用于展示有多个相同级别的入口。包含功能的图标和简洁的文字描述。实现这个布局主要就是用了 weui 中的 .weui-grid,这种布局在 mpvue中也是完全支持的,示例代码如下: <template> <div class="page"> <div class="page__bd"> <div class="weui-g

  • 九宫格问题,要求: 行列必须为相等的奇数 每行数字之和、每列数字之和、两个对角线数字之和,都相等 思路说明 按照下面的方式排列 横向为x(从0到n-1),纵向为y方向(从0到n-1) 1、第一个数放在X方向的中间位置 2、其它数顺次放置各个位置,并依据如下原则:(假设第一个数是a,第二个数是b) 以a为中心的位置关系分别为: 左上|上|右上 左 |a |右 左下|下|右下 (1)b放在a的右上位置

  • 本文向大家介绍轻松实现Android自定义九宫格图案解锁,包括了轻松实现Android自定义九宫格图案解锁的使用技巧和注意事项,需要的朋友参考一下 Android实现九宫格图案解锁,自带将图案转化成数字密码的功能,代码如下: LockPatternView.java PointView.java MainActivity.java  效果图如下: 附上源码地址:https://github.com

  • 本文向大家介绍jquery——九宫格大转盘抽奖实例,包括了jquery——九宫格大转盘抽奖实例的使用技巧和注意事项,需要的朋友参考一下  一、用到的图片 二、代码如下,重点是js部分 效果如下: 三、注意事项 1、抽奖过程说明 上面只是前端展示的效果。中奖物品通过一个随机数生成。 真正开发中中奖物品是通过向后端接口发送请求返回的。 2、兼容性说明 .mask开始如下,用的是rgba,但是IE8不兼

  • 本文向大家介绍jquery实现九宫格大转盘抽奖,包括了jquery实现九宫格大转盘抽奖的使用技巧和注意事项,需要的朋友参考一下 下面我们来分享一个九宫格抽奖特效 特效说明: 一款jQuery九宫格大转盘抽奖代码网页特效,点击抽奖按钮开始随机抽奖选择奖品,可设置起点位置、奖品数量、转动次数、中奖位置参数。(兼容测试:IE7及以上、Firefox、Chrome、Opera、Safari、360等主流浏

  • 本文向大家介绍实现九宫格布局相关面试题,主要包含被问及实现九宫格布局时的应答技巧和注意事项,需要的朋友参考一下

  • 题目描述 九宫格是一款广为流传的游戏,起源于河图洛书。 游戏规则是:1到9九个数字放在3×3的格子中,要求每行、每列以及两个对角线上的三数之和都等于15. 在金麻名著《射雕英雄传》中黃蓉曾给九宫格的一种解法,口诀:戴九恩一,左三右七,二四有肩,八六为足,五居中央。解法如图所示。 现在有一种新的玩法,给九个不同的数字,将这九个数字放在3×3的格子中,要求每行、每列以及两个对角线上的三数之积相等(三阶

  • 本文向大家介绍js实现九宫格抽奖,包括了js实现九宫格抽奖的使用技巧和注意事项,需要的朋友参考一下 本文实例为大家分享了js实现九宫格抽奖的具体代码,供大家参考,具体内容如下 CSS: js: 以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持呐喊教程。