- 博客(28)
- 收藏
- 关注
原创 模拟select,自定义样式
注意:图标采用bootstrap的iconfont 也可以使用其他字体图标 但需要保留i标签结构。option包含四种样式。
2024-04-08 16:25:01 437
原创 滑块滑动效果(手机端+pc端)
图片效果:<!DOCTYPE html><html lang="en"> <head> <meta charset="UTF-8"> <title>滑动图片验证</title> <style> #tiao{ width:67%; height:3rem; position:relative; margin:3rem auto 0; border:1px so...
2021-08-30 18:06:33 455
原创 datav使用教程
1.npm install @jiaminghi/charts2.npm install @jiaminghi/data-view3.main.js 里添加import dataV from '@jiaminghi/data-view'Vue.use(dataV)4.在vue页面中引入import Charts from '@jiaminghi/charts'5.实例化const container = document.getElementById('contain..
2020-07-27 15:45:00 15348 1
原创 vue-video-player 小白笔记
<template> <video-player class="video-player-box" ref="videoPlayer" :options="playerOptions" :playsinline="false" customEventName="customstatechangedeventname" @play="onPlayerPlay...
2020-04-16 11:22:36 652
原创 vue+element tree组件多层级嵌套,合并指定层级,复选框样式修改,清空选择项等功能
注:逻辑不可考究,主要实现各种基础功能,放到vue-element项目里可直接运行<template> <el-form :model="ruleForm" :rules="form_rules" ref="ruleForm" style="margin-left:50px;"> <el-row> <el-tooltip class="i...
2020-04-16 10:53:37 2276
原创 vue 生成海报,解决跨域问题 ,下载图片到本地
// 获取图片元素// 创建图片元素var img = new Image();//设置图片跨域img.setAttribute("crossOrigin", "anonymous");//设置图片路径img.src = url;//下载图片img.onload = function() { //创建画布 var can = document.createEleme...
2019-09-09 12:18:21 3939 1
原创 vue 微信公众号 canvas 生成图片 长按分享朋友
效果图vue页面<template> <div class="page-share"> <div class="content"> <div id="qrcode"></div> <img class="poster" id="bg" src="../../assets/images/income/s...
2019-07-25 17:48:14 2443 3
原创 vue 移动端 简单分页组件
分页组件:pagination.vue<template> <div class="pagination"> <div class="page" v-if="totalPage>0"> <span :class="page==1 || totalPage==0?'undis':''" @click="changePage('pev'...
2019-07-23 12:05:09 1238
原创 web应用实现微信、QQ第三方登录
微信登录:$('#wx').on('click',function(){ var APPID=541837601,//项目应用appid respon='http://192.***.50.251:*****';//是注册appid时填写的主域名下的地址 respon=encodeURIComponent(respon)//地址要进行转码 window.location.h...
2019-07-04 16:40:40 953
原创 vue+vux + AntV f2 图表
最终效果:1.安装:npm install @antv/f2 --save<template> <div class="box"> <div class="chart"> <span class="y-title">金额/RMB</span> <canvas id="mountNode"> ...
2019-07-04 16:37:21 3486
原创 qq授权三方登录 web端
<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <script type="text/javascript" src="http://qzonestyle.gtimg.cn/qzone/openapi/qc_load...
2019-04-02 18:47:26 3420 1
原创 前端使用canvas生成海报并实现下载 js
<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> </head> <body> <canvas id="img" width="500px" height="500px"></c...
2019-03-29 19:02:23 4437
原创 if语句中定时器的问题
for(var i = 0; i <10 ; i++){ if(i == 5){//第五秒移除 setTimeout(closePop,5000); function closePop(){ console.log(i) } ...
2019-03-20 12:28:40 1758
原创 购物车单选、多选等功能
不多讲,逻辑很简单,小白写法,直接运行代码1:样式部分body{ background: #f5f5f5;}.head{ width: 100%; height: 4.4rem; border-bottom: 1px solid #DDDDDD; text-align: center; line-height: 4.4rem; font-size:1.8rem; font-fa...
2018-03-19 14:31:57 1637 3
原创 js一键复制+clipboard.js(pc,ios,android均可使用) 一个页面多个复制按钮
1.在移动项目中订单号复制功能,兼容pc和ios、android<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title> <style> *{ margin:0; padding:
2018-03-19 13:51:42 3601
原创 RN项目 遇到的问题(持续更新)
1.unable to load script from assets ‘index.android bundle’ ,make sure your bundle is packaged correctly or you’re runing a packager server 解决方法1.:在android/app/src/main/下创建文件夹assets
2018-01-29 17:51:28 1053
原创 前端开发-react-native 项目
快速搭建rn项目步骤:1.命令行指令:npm i react-native-cli -g2.react-native init aaa3.Android Studio 导入创建的aaa项目下的Android文件夹,在安卓模拟机里运行(Android Studio 安装参照官网) 步骤详解 1.安装react native cli 2.react-native init aa(项目名)
2017-12-15 18:03:44 478
原创 复选框状态更改不生效(个人笔记类随笔)
`$(this).css({‘backgroundImage’:”url(‘img/collection_edit_select_n.png’)”}) jq操作复选框 attr与prop的区别 在jq操作复选框的过程中 attr获取的是复选框的属性 而prop则反应的是复选框的状态,也就是说如果要控制复选框的被选中状态和未被选中状态,要使用prop进行操作才可,否则无效。 示例代码:(项
2017-12-04 14:00:07 364 1
原创 前端jq-MD5加密 + js-base64加密
加密js资源链接分享<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Document</title> <script type="text/javascript" src="js/core.js"></script> <script type="text/javascript"
2017-11-23 19:49:47 1403
原创 高德地图获取当前地址
<!doctype html><html><head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-w
2017-11-23 11:03:21 5295 3
原创 微信唤起本地app进行导航
<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>导航</title> <meta name="viewport" content="initial-scale=1, maximum-scale=1"> <script src="http://res.wx.qq.com/open/js/jwei
2017-08-05 16:26:47 826
原创 微信公众号中高德地图显示路线
<!DOCTYPE html><html><head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-w
2017-08-05 11:52:27 8446
原创 微信开发 调取相机兼容苹果手机
项目需求 只能拍照并且每张照片都要获取定位配置信息,参考微信官方开发文档 // 调取相机 var URL = location.href.split('#')[0]; var shareConfig = { timestamp: Math.round(new Date() / 1000), nonceStr: Math.round(new Da
2017-07-18 11:32:56 502
原创 input上传图片+预览图片
使用原声input上传图片html> head> meta charset="UTF-8"> title>URL.createObjectURL()title> head> body> input type="file" accept="image/*" id='chooseImg'/> img s
2017-07-18 10:19:10 520
原创 百度地图引入 简单定位功能的实现 待修
百度地图引入:script src="http://api.map.baidu.com/api?v=1.4" type="text/javascript">script>控制台报错!解决方法:简单的具备定位功能的地图代码示例: // 创建地图对象并初始化var mp = new
2017-06-15 14:46:00 637
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人