
插件
文章平均质量分 65
一天一天积累
这个作者很懒,什么都没留下…
展开
-
vue的picker插件
效果图:github地址:https://github.com/naihe138/vue-picker项目下载下来之后,执行yarn,yarn run rollup,yarn run build使用方法:普通网页开发直接复制项目下的lib/vue-picker.js文件即可直接使用<scriptsrc="../../static/js/utils/vuePicker/vue-picker.js"type="text/javascript"></scri...原创 2021-04-13 15:58:42 · 2100 阅读 · 0 评论 -
vue的日历插件vue-hash-calendar
效果图:vue-hash-calendar的github地址https://github.com/TangSY/vue-hash-calendarcdn方式引入:js CDN:https://cdn.jsdelivr.net/npm/vue-hash-calendar@{version}/lib/vue-hash-calendar.umd.min.jscss CDN: https://cdn.jsdelivr.net/npm/vue-hash-calendar@{version}/l原创 2021-04-13 15:22:55 · 2953 阅读 · 0 评论 -
art.dialog窗体之间传值
父页面//添加商品var data;function changeGoods(index){ var brandId=$("#brandId").val(); parent.art.dialog.open('/replenishment/toAddGoods', { title: '选择商品', width:1200, height:600, ...原创 2020-07-09 10:37:26 · 1129 阅读 · 0 评论 -
vue中点击按钮实现复制 vue-clipboard2
npm install --save vue-clipboard2首先先安装并引入:importVuefrom'vue'importVueClipboardfrom'vue-clipboard2';//引入复制功能插件Vue.use(VueClipboard);html部分:<inputv-model="shareUrl"disabled="disabled"><buttontype="button"v-clipboard:copy="s...原创 2020-06-12 10:48:01 · 477 阅读 · 0 评论 -
clipboard复制功能,实现静态复制和动态复制
引入jQuery和clipboard文件<script src="http://code.jquery.com/jquery-3.4.1.min.js"></script><script src="https://cdnjs.cloudflare.com/ajax/libs/clipboard.js/2.0.4/clipboard.min.js">&...原创 2020-03-12 17:54:54 · 3381 阅读 · 0 评论 -
代码格式化插件
效果图为:使用了OSChina会员沙王重名了提供的代码实现https://www.oschina.net/code/snippet_119610_11825html部分:引入css文件和js文件<link rel="stylesheet" href="css/s.css" /><script type="text/javascript" src="js/c.js" >&am原创 2018-06-14 17:41:25 · 2822 阅读 · 0 评论 -
parallax插件 视差效果实现
效果图:首先引入需要的文件,parallax依赖于jQuery,parallax下载地址https://cdn.bootcss.com/parallax/2.1.3/jquery.parallax.js,使用时可以参考此处的文档https://blog.youkuaiyun.com/qq_26383604/article/details/72637068<script src="js/j...原创 2018-11-22 11:34:48 · 2102 阅读 · 0 评论 -
hammer实现拖拽旋转缩放功能
效果: 首先下载hammer插件http://hammerjs.github.io/html部分:<script type="text/javascript" src="js/hammer.min.js"></script> <div class="resultCon"> <p>人景合成图:&原创 2018-12-04 11:27:48 · 3425 阅读 · 1 评论 -
wx-charts图表滑动功能
插件下载地址已经api文档https://github.com/xiaolin3303/wx-charts要实现滑动页面部分需要绑定这三个事件bindtouchstart="touchstart" bindtouchmove="touchmove" bindtouchend="touchend"<canvas canvas-id='areacanvas' class='canva...原创 2018-12-12 11:18:24 · 4232 阅读 · 2 评论 -
pc和移动端图片裁剪插件PhotoClip的踩坑
遇到的问题有,苹果手机上传的图片会自动旋转,安卓手机上要裁剪图片的无法进行缩放(github上查到原因iscroll插件的bug,替换到2.X版本可修复),已填坑文章参考https://www.npmjs.com/package/photoclip文件路径:http://imagesouth.xxlimageim.com/hammer.min.jshttp://imagesouth.x...原创 2019-04-22 15:12:03 · 3906 阅读 · 1 评论 -
使用layui修改table样式
table的结构: 序号 登录账号 用户名 权限 操作 ${(user.id)!''} ${(user.userAccount!'')} ${(user.userName!'')} ${(user.原创 2017-12-18 16:52:49 · 32343 阅读 · 0 评论 -
layui的select联动
要实现联动效果注意两点:第一要可以监听到select的change事件;第二异步加载的内容,需要重新渲染后才可以 正常使用。html结构:所在省份: 请选择省份 ${provincelist.fullname} 所在城市 :原创 2017-12-18 17:07:53 · 70273 阅读 · 6 评论 -
比较好的播放视频插件swfobject.js
播放视频的方法:方法一、 使用html5播放 your browser does not support the video.poster用来设置视频的封面图,loop是否循环播放autoplay是否自动播放controls是否显示控制按钮缺点:兼容不太好方法二:使用视频插件swfobject.js 首先下载下载所需要的文件,在demo.h原创 2015-01-05 17:29:42 · 5661 阅读 · 4 评论 -
安装sass失败,解决方法
转载http://www.w3cplus.com/sassguide/install.htmlruby安装因为sass依赖于ruby环境,所以装sass之前先确认装了ruby。先导官网下载个ruby在安装的时候,请勾选Add Ruby executables to your PATH这个选项,添加环境变量,不然以后使用编译软件的时候会提示找不到ruby环境转载 2015-04-14 15:29:43 · 3667 阅读 · 0 评论 -
hammer.js实现移动端的拖放效果
hammer.js可以实现移动端的多种触摸效果。详细可以点击http://www.cnblogs.com/iamlilinfeng/p/4239957.html不过发现hammer.js实现功能时,只能是原生js,jquery代码在hammer中不起效果。一、引入hammer.js 下载http://hammerjs.github.io/二、创建(触屏点击效果)//点击原创 2015-05-12 15:27:46 · 5363 阅读 · 0 评论 -
使用touch-punch.js实现移动端的拖放效果
一、下载文件并引入下载地址:http://touchpunch.furf.com/引入:这里可以查看参数http://www.cnblogs.com/ganqiyin/archive/2013/12/12/3471622.html二、使用html部分:原创 2015-05-15 12:17:34 · 8108 阅读 · 1 评论 -
制作svg动画
要实现一步一步画出来一个图片,css3做不到吧,除非一张张的图片定时显示。想不到别的招了。现在用的是一个插件,做了一个svg动画。插件地址:http://lazylinepainter.info/先用AI做好路径,保存为svg格式的文件。使用插件,先引入需要的文件: window.jQuery || document.write('')demo如下:原创 2015-07-29 20:46:49 · 5349 阅读 · 0 评论 -
swiper插件制作轮播图swiper2.x和3.x差别
swiper3.x只兼容到ie10+,比较适合移动端。swiper3.x官网 http://www.swiper.com.cn/swiper2.x可以兼容到ie7+,官网是http://swiper2.swiper.com.cn/2.x和3.x使用上有差别2.x需要引入linkrel="stylesheet"href="css/idangerous.swi原创 2015-08-16 14:37:05 · 7355 阅读 · 0 评论 -
整屏网站制作
整屏参考网站收集的有http://www.coracle.com/index.html和http://comicplus.cn制作整屏网站可以使用插件,例如swipe.js和fullpage.js一、使用swiper制作整屏网站swiper.js的使用方法可以到swiper中文网上http://www.swiper.com.cn/demo/index.html查看demo,也可以下载整原创 2016-01-16 19:46:02 · 1049 阅读 · 0 评论 -
使用echarts简单制作省份地图
引入echarts.min.js文件,http://echarts.baidu.com/download.html下载地址引入对应省份的js文件 可以在http://echarts.baidu.com/download-map.html?qq-pf-to=pcqq.c2c生成省份的json格式文件,然后再将其转化成henan.js文件var henanJson=下载的json数据:原创 2016-10-24 18:10:28 · 66474 阅读 · 42 评论 -
图片拾色器
使用的插件来自http://www.jq22.com/jquery-info5319,说明:不支持IE8等低版本浏览器,Chrome本地预览会出现canvas跨域问题,请换用其它浏览器或在服务器环境下测试。结构:Sorry, your browser dose not support canvas.点击上面的canvas来查看效果 引入的js内容:if (ty原创 2017-12-19 16:13:16 · 3402 阅读 · 0 评论 -
使用echarts简单制作中国地图
网站需要一张中国地图,并且鼠标经过某个省份,该省份的省份名字显示,而且该省份的地区会变色显示。第一种方法:将每个省份的图片定位(先隐藏),拼合成一张中国地图,然后再定位省份名称,鼠标经过省份名字,添加hover事件,将对应图片显示。第二种方法:使用图形插件echarts,轻松制作。http://echarts.baidu.com/doc/example.html在echarts原创 2014-12-12 15:58:40 · 24516 阅读 · 5 评论