![](https://img-blog.csdnimg.cn/20201014180756927.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
综合应用
文章平均质量分 74
一些本人开发的综合应用
iamlujingtao
学而致用才是真理
展开
-
vue3.2+ 滑动验证组件,pc/手机通用,即插即用
支持vue3.2+语法、支持typescript、支持pc/手机(自动适配)、即插即用的vue3.2+ 滑动验证组件原创 2022-05-13 21:10:39 · 3175 阅读 · 1 评论 -
小程序表单校验uni-forms正确使用方式及避坑指南
解决小程序上使用uni-forms表单验证的问题,实现即时校验、自定义校验规则、异步校验,满足绝大部分表单校验!原创 2022-05-13 20:20:08 · 17961 阅读 · 1 评论 -
html5拖放+vue+localStorage,实现拖放排序并记录到本地
html5拖放+vue+localStorage,实现拖放排序并记录到本地前言效果技术要点完整代码前言因业务需求,需要在页面上列出多个视频,并能拖放排序,且记录排序。现使用技术如下:vue + html5的drag事件实现元素拖放排序 +l ocalStorage记录到本地浏览器上,刷新页面不会重置排序。本示例为了更好的用户体验,排序后使用css3 的 translate 来变更元素位置...原创 2020-01-16 17:05:13 · 413 阅读 · 0 评论 -
js+animate.css实现滚动页面,元素动态出现(附演示地址和源码)
js+animate.css实现滚动页面,元素动态出现(附演示地址和源码)一、背景二、效果三、原理四、在线演示和源码一、背景之前做项目用到滚动页面,元素动态出现的效果,当时研究一番决定用Animate.css + fullpage.js + 一堆js控制,这段时间也有项目也有这种需求,不过不是整页滚动,而是不确定高度滚动,所有用不到fullpage,于是只能手写js控制。二、效果三、原理...原创 2019-10-17 10:54:38 · 6508 阅读 · 1 评论 -
解放双手,nodejs批量处理文件(匹配+重命名+转换代码)
解放双手,nodejs批量处理文件(匹配+重命名+转换代码)一、背景二、需求三、成果一、背景公司现在有2套系统,新系统和旧系统,2套系统使用的技术方案不同,所以网站代码也有些不同。现在需要把旧系统代码转换为新系统代码,通常情况下我们是手动修改的,但是改了几次后发现实在痛苦,于是想能否让程序自动转换。如果只是替换代码,很多软件都可以,但是实际情况不是简单的替换,而是要做很多复制判断,而且整个...原创 2019-10-17 09:45:29 · 1605 阅读 · 0 评论 -
web模拟战旗游戏战场(附演示地址&源码)
前言本人从小受到“火焰纹章”、“机器人大战”等熏陶,比较喜欢策略型游戏,但有时候玩人家的游戏总有点不尽人意,于是尝试模拟这类型游戏。本次尝试用web技术实现战旗游戏中战场的游戏逻辑。先放成果:在线地址游戏逻辑战旗游戏逻辑比较简单:一、总方向单位:我方 vs 敌方操作:移动+行动结束条件:一方团灭二、实现细节地图:底图 + 操作层 + 单位层单位放置:随机地图 + 随机单位属...原创 2019-09-18 17:27:33 · 604 阅读 · 0 评论 -
开箱即用:网站换肤(附演示地址和源码)
开箱即用:网站换肤(附演示地址和源码)一、前言二、原理三、演示四、在线演示&源码一、前言现在很多网站都要求支持换肤(色)功能,我整理了一个最简单的demo,支持cookie(刷新有效),供有需要的人事直接投入使用。二、原理三、演示四、在线演示&源码–>在线演示地址–>GitHub地址...原创 2019-10-16 09:16:14 · 864 阅读 · 0 评论 -
开箱即用:div模拟select并美化
通常我们做友情链接都是用默认的,但各浏览器的风格都不一样,而且css还不能做成各浏览器一致的效果,所以对于要求高的客户,或者输出人员自己也受不了的时候,还是自己用div模拟一个吧。效果:html:<!-- 友情链接 --> <section class="friendLinks clearfix"> <dl> <dt&...原创 2019-10-16 09:01:16 · 258 阅读 · 0 评论 -
chrome自制插件--百度搜索结果去广告1.0
chrome自制插件--百度搜索结果去广告1.0一、前言二、效果三、说明四、安装五、下载一、前言国内用户用百度的占绝大多数,但是百度搜索结果的广告真烦人,特别是搜索“黄金”或者“理财”等相关信息,结果发现网页第一版全是所谓的推广链接,而且你会发觉这些链接大部分都是虚假网站,以骗钱为目的,关键这些链接还很难区分开来,要又经验并且仔细看才能区分,百度真无节操,当然你用vpn上google就安逸了。...原创 2019-10-16 00:26:04 · 1716 阅读 · 0 评论 -
chrome自制插件--动易网站后台一键登录v1.4
动易网站后台一键登录v1.4一、介绍一、介绍上篇《chrome自制插件–简单一键登录(附插件开发介绍)》我介绍了chrome插件开发和后台一键登录简单版,本篇提供功能强大的正式版。注意:本插件针对动易系统后台登录,当然你也可以修改源码,适应你的系统和实际使用情况。1.4版本更新:1、智能识别新旧版本系统,如果识别失败请手动添加记录2、新增“默认帐号”管理功能,在没有配置网站记录的情况下...原创 2019-10-15 23:38:34 · 1165 阅读 · 0 评论 -
chrome自制插件--简单一键登录(附插件开发介绍)
chrome自制插件--简单一键登录(附插件开发介绍)一、前言二、需求三、文件结构及代码3.1 第一步:建立文件3.2 第二步:修改manifest.json,配置插件3.3 第三步:修改background.js文件,实现想要的功能3.4 第四步:修改contentscripts.js文件,用于自动登录3.5 第五步:chrome加入插件四、GitHub源码五、参考资料一、前言chrome快...原创 2019-10-15 23:38:49 · 8279 阅读 · 4 评论 -
html5调用摄像头并拍照
html5调用摄像头并拍照一、注意二、开始三、在线演示和源码一、注意1、必须在https协议下才,并且允许实用摄像头。2、原本是想在手机上用的,但发现ios手机上不行,安卓的不知道,pc+chrome就可以,待解决。二、开始研究了下用html5+javascript 调用摄像头并拍照,代码参考了网上的,然后做了个小demo。原理主要用到 Vedio + Canvas + getUs...原创 2019-10-15 21:42:31 · 2320 阅读 · 1 评论 -
傻瓜式搭建多人协作vue工作环境(GitHub Desktop + VSCode + Webpack + Vue)
你遇到的问题是不是被一堆git命令搞到晕?是不是在cmd打命令再切换到编辑器写代码,麻烦得一b?是不是装webpack踩到各种坑?是不是不知道怎么配合webpack写一个vue的hello world?是不是不知道怎么把写好的代码同步GitHub代码?来来来,这里用一篇文章介绍怎样搭建一个傻瓜式多人协作的vue工作环境,利用VSCode这神器,把一切都简单化。(笔者也是踩过各种坑啊...原创 2019-09-21 17:46:20 · 1974 阅读 · 0 评论 -
html5获取我的位置并在百度地图上显示
HTML5获取我的位置并在百度地图上显示一、前言二、在线演示和GitHub源码一、前言最近有兴趣研究了下移动端的地图api,发现其实挺简单的,HTML5也提供了地理位置API:Geolocation,能获取当前所在位置的经纬度,结合一些地图api,就能直观地看到我在地图上所在的位置,相当于app应用里面的“我的位置”。在网上搜下Geolocation就能获得详细信息,其实核心就是这个:nav...原创 2019-10-16 09:03:45 · 763 阅读 · 0 评论 -
javascript结合css3制作手机菜单左滑特效(附演示地址和源码)
javascript结合css3制作手机菜单左滑特效(附演示地址和源码)一、前言二、在线演示和GitHub源码三、原理说明四、核心代码一、前言现在我们见过很多手机展示菜单的方式是整个页面向左滑动,然后右侧出现菜单,然后点击或者向右滑动左侧页面收起菜单。这种菜单用户体验比较好,现在一些针对手机端框架都包含了这种效果,例如jqm,但我们实际开发的时候往往只需要这一个效果,如果调用整个框架,总感觉有...原创 2019-10-15 14:39:59 · 553 阅读 · 0 评论 -
基于superslide的文字动画全屏焦点图(附演示地址和源码)
基于superslide的文字动画全屏焦点图一、前言二、在线地址及GitHub源码三、核心代码讲解一、前言对于焦点图,我们平时用superslide已经能实现大部分效果,但有时候想实现些更绚丽的效果,例如现在一些流行的焦点图都有切换图片后几段文字(图片)独立动画出现,这样有视觉差异,动画效果更生动,其实如果你熟悉js,那么在superslide的基础上也可以做出一样的效果。思路就是利用sup...原创 2019-10-15 13:58:48 · 629 阅读 · 0 评论 -
老板,今年有哪些大众好电影?(nodejs豆瓣电影爬虫)
老板,今年有哪些大众好电影?(nodejs豆瓣电影爬虫)前言目标页面分析设计思路效果演示GitHub 和源码前言现在看电影通常都会看豆瓣评分,虽然豆瓣本身有筛选功能,但是缺乏了一个重要元素:评分人数。想看好电影,通常是按评分排序,这时候会有好几十个评分9+的电影,但是点击查看发现评分人数寥寥无几,这些就缺乏参考价值了,通常只是少数人的狂欢,意义不大。所以必须综合考虑,加上评分人数,最少上w吧...原创 2019-10-13 16:24:19 · 713 阅读 · 3 评论 -
javascript移动设备触屏画板(附演示地址和源码)
javascript移动设备触屏画板(附演示地址和源码)一、前言二、在线演示和GitHub源码三、示例核心代码一、前言上篇学习了 《javascript移动设备触屏事件及练习》后,我们初步了解了触屏事件。这次我们这基础上打造一款有触摸功能的画板,好让我们的艺术细胞发扬广大。触摸事件我们用到“touchstart、touchmove、touchend”,而画板我们用到html5的“canv...原创 2019-10-15 12:05:27 · 573 阅读 · 3 评论 -
jQuery横向/纵向滚屏特效练习(附demo源码)
jQuery横向/纵向滚屏特效练习(附demo源码)一、前言二、效果三、在线演示和源码一、前言横向/纵向滚屏特效现在挺常见的,应用的地方也很多。虽然网上已有相关插件,但个人还是自己做了2个demo,供练习和需要的时候使用,如有兴趣你也可以下载源码来看看。可以鼠标点击/划过导航或者滚轮切换屏幕。二、效果三、在线演示和源码–>在线演示–>GitHub源码...原创 2019-10-15 11:13:28 · 300 阅读 · 0 评论 -
jQuery百叶窗效果原理(附3个demo源码)
jQuery百叶窗效果原理,附3个demo源码一、前言二、原理图解三、在线演示及源码一、前言对于轮播图切换,其实可以有更多效果,其中一类型就是百叶窗。本人参考了网上一些特效,做一些练习和实践,没有封装函数,考虑扩展到SuperSlide。重点是实现效果的思路,并不是代码,掌握了思路可以扩展无限种效果。二、原理图解三、在线演示及源码效果:–>在线演示地址–>GitHub...原创 2019-10-15 10:48:34 · 455 阅读 · 0 评论 -
跟我做css3的ppt(Animation介绍&Animate.css应用)
跟我做css3的ppt(Animation介绍&Animate.css应用)一、前言二、Animation 介绍和demo三、Animate.css 介绍四、使用Animate.css做一个ppt一、前言上一篇文章《翻滚吧少年!(自定义css3动画过渡中的贝塞尔曲线)》我简单介绍了css3中transition的使用,和自定义过渡中的贝塞尔曲线,效果已经很好了,但有一个比较明显的缺点就...原创 2019-10-15 01:09:02 · 1115 阅读 · 0 评论