前端
关注
分享
扫一扫
文章平均质量分 51
daodfs1
这个作者很懒，什么都没留下…
展开
-
兼容所有浏览器的拖拽功能代码
兼容上古IE6、上古火狐浏览器，也兼容现代浏览器。以下是在现代chrome浏览器下的效果。原创 2023-06-08 16:21:56 · 312 阅读 · 0 评论 -
RSA签名加密解密
支持的密钥长度包括4种 RSA512、RSA1024、RSA2048、RSA4096支持的签名算法包括7种 MD2withRSA、MD5withRSA、SHA1withRSA、SHA224withRSA、SHA256withRSA、SHA384withRSA、SHA512withRSAJava 和 Javascript 支持的生成密钥对签名加密解密功能可以通用。原创 2023-02-24 12:13:26 · 1707 阅读 · 0 评论 -
网页版俄罗斯方块
兼容性兼容IE10，现代浏览器效果图项目结构tetris css tetris.css js tetris.js tetris.htmltetris.html<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>俄罗斯方块</title> <link rel="stylesheet原创 2021-11-20 21:00:00 · 3720 阅读 · 0 评论 -
网页版空当接龙
已经一年没写前端代码了，为了上班划水，三天写了个空当接龙游戏兼容性兼容现代浏览器效果图项目结构free-cell css free-cell.css img 存放图片素材 js free-cell.js free-cell.html图片素材命名规则num-color-type.pngnum–数字（1 - 13）color–颜色（1-红色 2-黑色）type–类型（1–红心 2-黑桃 3-梅花 4-方块）free-cell.html<!D原创 2021-10-30 18:31:06 · 7421 阅读 · 4 评论 -
生成银行卡号校验位和校验银行卡号
大多数银行卡为16位或19位，所以只支持16位或19位的银行卡最后一位是校验位，银行卡校验规则基于Luhn算法以卡号6212280200141664948为例校验过程为：去掉校验位 8，得621228020014166494卡号倒数偶数位相加，即 9 + 6 + 1 + 1 + 0 + 0 + 2 + 1 + 6 = 26卡号倒数奇数位分别乘以2，即 4、4、6、4、0、2、8、2、2分别乘以2，得 8、8、12、8、0、4、16、4、4奇数位乘以2得到的如果是两位数，则个位和十位相加.原创 2021-07-14 21:29:07 · 4947 阅读 · 0 评论 -
网页版扫雷
新建一个空html文件，粘贴下面的代码，保存后，用浏览器打开就可以玩了（兼容IE10）<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>扫雷</title> <style> .container {margin: auto;width: 960px;} .panel {posit原创 2020-11-28 21:24:04 · 7450 阅读 · 0 评论 -
一个Java码农开发的前端组件库
https://github.com/daodefengshang/sunui使用原生js开发，以后可能只兼容到IE8或IE92020年10月31日，兼容到IE7,目前只包含toast、alert、confirm、combobox组件，还包含一个IE6-IE8支持的VML工具库原创 2020-10-31 16:55:45 · 235 阅读 · 0 评论 -
模拟input标签的placeholder效果
目录原理兼容性效果代码图片资源CSSHTMLJavaScript原理使input透明，placeholder内容放在input下面监听input内容变化，控制placeholder内容显示隐藏兼容性兼容所有浏览器效果chrome下的问题代码图片资源CSShtml,body { margin: 0; padding: 0; height: 100%; position: relative; left: 0; top: 0;}body { font-family:原创 2020-10-29 16:12:00 · 358 阅读 · 0 评论 -
nodejs控制windows关机重启
废话少说，上代码关机const { exec } = require('child_process');function shutdownWindow() { let command = exec('shutdown -s -t 00', function(err, stdout, stderr) { if(err || stderr) { console.log("shutdown failed" + err + stderr); }原创 2020-09-02 22:11:08 · 2280 阅读 · 0 评论 -
electron播放本地任意格式的视频
目录说明npm依赖核心代码创建一个独立的video-server.js文件，在子里程中运行，开启http服务创建一个独立的server-child.js文件，开启子里程运行video-server.js使用（非核心代码）html文件index.js文件说明不支持快进和显示时间，最大流畅支持2G/小时的视频，未使用硬件加速（技术水平不足），高清视频转码太慢。electron可以直接读取硬盘上的文件，对于mp4视频不需要转码（很不严谨，如需要更严谨，请参考别人的博客），直接将其路径赋值给video的src原创 2020-09-02 21:25:48 · 6164 阅读 · 2 评论 -
原生JS自定义alert和confirm
预览图低版本IE无发光效果话不多说，上代码image目录下的png图片资源目录结构CSS代码dialog.csshtml,body { margin: 0; padding: 0;}body { font-family: 'Microsoft Yahei', '微软雅黑', Arial, sans-serif; _background-attachment: fixed; _background-image: url(about:原创 2020-08-15 21:25:28 · 1177 阅读 · 0 评论 -
windows下nodejs遍历指定目录中的子文件路径
目录引入依赖封装函数使用方法引入依赖const fs = require('fs');const path = require('path')const { exec } = require('child_process');封装函数//读取盘符//callback结果 倒序盘符Arrayfunction showDiskLetter(callback) { var wmicResult = ''; var command = exec('wmic logicaldisk原创 2020-07-26 18:16:51 · 438 阅读 · 0 评论 -
自定义文件框样式
目录效果图原理HTML代码CSS代码Javascript代码封装代码CSS代码Javascript代码用法效果图原理IE10及以下版本只能通过用户点击input file文件框上传代码，将文件框透明度设置为0.01即可。HTML代码<body> <span class="sunui-filebox-container"> <div class="sunui-filebox-subcontainer"> <i原创 2020-06-07 22:32:51 · 218 阅读 · 0 评论 -
经典三角形分形 - 随便玩玩
<style> html,body { margin: 0; padding: 0; } #container { position: relative; width: 1000px; height: 650px; background-color: #000000; } #container div { position: absolute.原创 2020-06-07 21:40:57 · 856 阅读 · 0 评论 -
easyui combotree组件添加搜索功能
目录截图javascript代码java核心代码BUG截图javascript代码var $combotree = $('#combotree'); //input标签的jquery对象$combotree.combotree({ url : em.bp()+ "/org/loadAllOrgsByUser.do", panelWidth: 220, panelHeight: 240, panelAli原创 2020-05-11 17:53:56 · 1506 阅读 · 0 评论 -
electron打包h5应用为exe
目录说明环境步骤1. 安装 nodejs2.全局安装 electron3.创建应用程序 （手动）(1) 创建一个空的Static Web工程（本项目名称为eldemo）(2) 在eldemo下创建package.json文件(3) 在eldemo下创建main.js文件(4) 在eldemo下创建index.html文件(5) 在eldemo下创建renderer目录(6) 在renderer下创...原创 2020-04-30 23:31:49 · 818 阅读 · 0 评论 -
网页加载超大数据量列表初探
目录发现不足寻找灵感思路代码CSSHTMLJavascript说明发现不足前端发展了这么多年，已经有了很多优秀的框架、库，很多库都开发了代替原生select标签的组件。这些组件在小数据量时简直不要太好用，然而有时我们将大量数据全部一次性加载到页面上，网页卡死了，除了懒加载，别无他法。寻找灵感Android应用里的列表浏览功能跟这个需要几乎一样，我们可以向下滑动浏览上万，上百万条数据。And...原创 2020-04-10 16:49:12 · 901 阅读 · 0 评论 -
VML简单封装
目录兼容说明封装代码使用示例兼容说明兼容IE6-IE8封装代码(function(win, doc){ win.vmlEnable = (function () {return function () {return !+"\v1";}})(); if (!win.vmlEnable() || win.sunuiVml) {return;} win.sunuiVml...原创 2020-04-09 19:21:29 · 125 阅读 · 0 评论 -
统一社会信用代码校验和生成
目录java版javascript版java版import java.util.HashMap;import java.util.Map;public class CompanySocialUtil { private static final int[] orgCodeWeight = {3, 7, 9, 10, 5, 8, 4, 2}; private static fin...原创 2020-04-08 12:43:13 · 10184 阅读 · 2 评论 -
日期间隔月份的判断
目录兼容性需求难点错误做法解决思路代码兼容性几乎所有浏览器需求项目中常有需求，要求用户最多可查询信息的月份跨度难点月份跨度是最难的，因为月份的天数是不定的，有的31天，有的30天，二月份还有29天或28天，这就不能以多少天为一个月计算了。是不是很头疼？错误做法项目中前端同事写的代码if (前年两个日期不在同一年) {//do something} else if () {}...原创 2020-04-06 22:20:49 · 679 阅读 · 0 评论 -
对象数组转树与对象树转数组
目录对象数组转树对象树转数组js对象举例使用方法对象数组转树/*** @Param json 对象数组* @Param id 数组中每个对象唯一标识的属性名称* @Param parentid 数组中每个对象的父对象的唯一标识的属性名称* @Param children 数组转树后对象指向子对象集的属性名称，缺省值为_children*/function boxToTree (js...原创 2020-04-05 16:33:22 · 452 阅读 · 0 评论 -
js对象深拷贝
function deepCopy (source) { var result; if(Object.prototype.toString.call(source) === '[object Array]') { result = []; for(var i = 0, len = source.length; i < len; i++) { ...原创 2020-04-05 15:11:22 · 107 阅读 · 0 评论 -
前端仿ps调色板
目录兼容说明预览图CSS代码html代码Javascript代码兼容说明兼容IE8及以上浏览器、主流浏览器、IE6-IE7也可以使用预览图CSS代码.sunui-color-container,.sunui-color-container * { -webkit-box-sizing: border-box; -moz-box-sizing: border-box;...原创 2020-04-05 14:53:21 · 578 阅读 · 2 评论