自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(28)
  • 收藏
  • 关注

原创 自定义复选款与单选框,单独使用和在table中使用,并实现全选取消全选

注:字体文字取自bootstrap字体库。

2024-04-08 17:09:47 191

原创 模拟select,自定义样式

注意:图标采用bootstrap的iconfont 也可以使用其他字体图标 但需要保留i标签结构。option包含四种样式。

2024-04-08 16:25:01 437

原创 tab切换组件,可横向自适应滑动,带位置记忆,可一次添加多个

注:需要引入Jquery。

2024-03-29 17:02:25 271

原创 滑块滑动效果(手机端+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&lt;!DOCTYPE html&gt;&lt;html&gt; &lt;head&gt; &lt;meta charset="UTF-8"&gt; &lt;title&gt;&lt;/title&gt; &lt;style&gt; *{ 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

原创 评价星星效果

购物车星星 js原理 购物车星星 .bottom{ height:6.1rem; display: flex;

2017-11-22 10:41:56 526 1

原创 微信唤起本地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关注的人

提示
确定要删除当前文章?
取消 删除