- 博客(35)
- 收藏
- 关注
RSS订阅
原创 小程序，用户手机没有开启定位或没有授权定位的解决方案
我们先获取定位，如果用户拒绝或没有开手机定位都会进入fail里的getSetFun函数。通过跳转到首页已达到用户不开启定位或授权不能进行下一步。代码如下：onLoad(){ let that = this; wx.getLocation({ type: 'gcj02', success(res) { }, fail(error) ...
2020-05-06 10:28:13
5810
原创 微信小程序云开发——图片展示，视频播放案例
这次是帮朋友写的一个简单的小程序。考虑到成本和页面简单的问题，我就决定用小程序云开发来进行开发。后来实际开发的时候发现，页面用到图片实在是太多。CDN流量一个月5G根本不够用。但是我看到了数据库一天可以免费访问5万次，我就决定用base64来解决CDN流量不够用的问题。小程序云开发也是可以放视频的。有个提示就是我们在操作数据库的时候一定要注意权限的设置，不然就算你是管理员你在本地还是访问不到数据的...
2019-10-07 18:03:31
5514
2
原创 微信小程序云开发（数据库）
开发者可以使用云开发开发微信小程序、小游戏，无需搭建服务器，即可使用云端能力。云开发为开发者提供完整的云端支持，弱化后端和运维概念，无需搭建服务器，使用平台提供的 API 进行核心业务开发，即可实现快速上线和迭代，同时这一能力，同开发者已经使用的云服务相互兼容，并不互斥。目前提供三大基础能力支持： 1、云函数：在云端运行的代码，微信私有协议天然鉴权，开发者只需编写自...
2018-09-21 15:29:21
83098
52
原创 小程序在地图上画矩形
Page({/*** 页面的初始数据*/data: {longitude: 119.94311,latitude: 31.70165,angle: 26.565, // 夹角length: 50, // 矩形长度short: 25, // 矩形高度radius: 100, // 半径},// 获取位置onGetLocation() {w...
2020-05-06 10:29:35
1368
2
原创 html2Canvas上传图片，截图
需求：上传图片，输入祝福语。截成一张图片github地址：https://github.com/wubaibin/html2canvas.gitHTML<!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8"> <meta name="viewpor...
2019-12-11 21:42:12
353
原创 HTML上传图片截图
HTML<!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=no"> <...
2019-09-28 21:16:56
1013
原创 AngularJS笔记
1、什么是AngularJSAngularJS是一个开源的JS框架，目标是做SPA，适用在数据绑定操作比较频繁的场景2、AngularJS的四大特征①采用了MVC的设计模式 Model 数据 View 视图 Controller 控制器 MVC的工作原理：在view进行了交互，会通过控制器中的方法对数据增删改查相关的操作。...
2019-07-29 23:24:58
296
原创 React Native笔记
用HTML5和React Native分别实现盒子模型显示写发不一样：1、样式HTML5.a{ position:absoule; top: 0; left: 0; right: 0; bottom: 0; background-color:#fbfbfb;}React Nativea: { position: ...
2019-07-25 16:47:13
480
原创 Vue商品左栏目滑动跟右边内容展示的变化
如果你是用vue写移动端的话，我推荐使用better-scroll。better-scroll的使用可以参考better-server文档：https://ustbhuangyi.github.io/better-scroll/doc/zh-hans/Template<template> <div class="goods"> <div cl...
2019-07-14 16:11:16
2042
原创 Vue学习整理笔记
安装Vue前提是安装了NodeJS1、安装命令行工具 npm install --global vue-cli2、安装完成后检查是否安装成功 vue -V （V要大写）3、创建一个基于webpack模板的新项目my-project（项目名不能大写） vue init webpack my-project 注意安装过程 中有...
2019-07-14 16:04:19
378
原创 导航栏点击滚动
HTML：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title></head><body><div style="width: 1200px;margin:...
2019-04-29 07:40:09
279
原创 图片点击循环
HTML<div class="divContainer"> <div class="imgContainer"> <ul class="imgContent clear"> <li> <img src="image/1.jpg" alt=""> ...
2019-04-01 22:51:56
227
原创 JS 整屏滚动
HTML<div class="bodyContentContainer"> <div class="bodyContainer"> <div class="Container01"></div> <div class="Container02"></div> &l...
2019-03-31 22:51:17
1213
原创 JS模仿window屏保实现图片上下左右移动
HTML<div class="upgradeContainer"> <div class="upgradeImgContainer"> <img src="~/Content/Base/imgs/upgrade.png" alt="" /> <span class="dele
2019-01-30 14:15:24
794
原创 JS String
什么是string：由多个字符组成的只读字符数组string vs 数组：相同：1、下标; 2、.length; 3、.slice()不同：类型不同: API不通用API大小写转换：将str中的字母都转为统一的小写/大写str.toLowerCase()str.toUpperCase()何时：不区分大小写时，都要先转为一致...
2019-01-21 10:35:48
704
原创 JS DOM event
什么是event： 浏览器自动触发的，或用户手动触发的页面状态的改变事件处理函数： 当事件发生时，自动触发的函数——回调如何绑定事件处理函数：3种 1、在HTML中绑定： <ANY on事件名="js语句" 问题：不符合内容与行...
2019-01-19 15:12:45
442
原创 JS BOM总结
BOM的定义 Browser Object Model 专门操作浏览器窗口的API——没有标准 BOM包括： window： 1、代替ES中的Global充当全局作用域对象 2、封装所...
2019-01-19 15:04:50
379
原创 JS 定时器
定时器的定义： 让程序每隔一段时间间隔反复执行一项任务定时器分为：周期性定时器和一次性定时器周期性定时器： 让程序每隔一段时间反复执行一项任务如何操作：1、任务函数function task(){...}2、启动定时器var timer = setInterval(task,ms) 1000ms = 1...
2019-01-17 15:57:20
873
原创 JS DOM总结
目录DOM的定义DOM树DOM树的定义为什么会是树形结构根节点节点对象节点三大属性DOM的操作流程DOM查找 不需要查找可直接获取的元素 按HTML查找 按节点关系查找 按选择器查找 遍历节点DOM查找总结修改 内容 属性 样式添加删除替换...
2019-01-17 09:56:47
865
原创 如何修改H5中的audio样式
HTML<div class="btn-audio clear"> <img src="image/audioBg.jpg" alt="" class="lf" style="width: 5.2rem;"> <div class="lf">
2018-12-15 16:07:09
15335
5
原创 资讯列表上拉刷新
这边是手机端的页面。里面有数据循环渲染，上拉刷新数据，时间处理。HTML<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-wi
2018-11-23 09:56:51
3082
1
原创 微信小程序上传图片
我这里上传图片有两种方法：1、利用Canvas将图片转base64（有些数据库要将图片转base64格式） 2、将图片上传到云上方法一：思路是这样的：因为小程序中的wx.arrayBufferToBase64();不支持本地文件转base64，所以我们先将图片用canvas将图片画出来，然后见canvas转成png格式的图片，最后将png格式的图片通过wx.arrayBufferTo...
2018-10-11 16:57:43
1178
原创 倒计时（JQuery）
HTML<!--倒计时--> <div class="timeContainer"> <p class="timeTitle">距离开播还有</p> <ul class="timeContentContainer clear"> &l
2018-09-17 17:29:39
1591
原创 上传头像（利用Canvas处理图像）
上传头像的具体实现：点击将原来的图片换成点击的图片，不过图片变成了Canvas画布，可以通过移动来改变图像。点击确定将Canvas画布转成base64格式，你可以将base64格式的图像上传到服务器。这个下面JS中会用到的从指定位置裁剪原始图片指定宽高，填充到画布上：drawImage(img,sx,sy,swidth,sheight)从指定位置裁剪原始图片指定宽高，从指定位置开始...
2018-09-04 15:45:14
820
原创 HTML5 Canvas基础
现在前端Canvas用到的地方也是比较多的，下面来了解一下Canvas。目录什么是Canvas及注意事项使用Canvas绘图矩形使用Canvas绘制文本Canvas绘图中使用渐变Canvas绘图 路径Canvas绘图 图像Canvas绘图 变形操作什么是Canvas及注意事项Canvas：画布，是H5提供2D绘图技术<canvas wid...
2018-08-25 17:32:25
844
原创 JS函数基础
目录什么是函数作用域 声明提前按值传递全局函数分支结构循环内置对象/包装类型String正则表达式RegExpMathDate什么是函数什么是函数：函数又叫方法，在程序里面函数是用来执行某些特定功能的代码。为了减少重复使用代码，可以把特定功能的代码做成函数，需要使用时拿出来调用这里和大家解释一下函数与事件的区别：事件是在特定条件下...
2018-08-23 17:38:15
2406
原创 JS基础
JS基础包括：JS简介、变量、常量、数据类型、数据类型转换、运算符和表达式。大家都知道前端的三大语言：HTML、CSS、JS。HTML：专门编写网页内容。CSS：专门编写网页样式。JS：专门编写网页交互行为。所以，对于一个网页来说，JS是网页的灵魂，是重中之重。JS典型的用途：1、客户端表单验证 2、客户端数据计算 3、客户端动画效果。目录JS简介变量常量数据类型...
2018-08-22 17:56:00
893
原创 JS数组总结
我们在数据处理的时候经常会用到数组，下面是我对数组的一些总结。什么是数组：储存多个数据，并提供操作数据的API的对象数组根据下标可以分为索引数组和关联数组。索引数组索引数组：下标都是数字的数组如何创建索引数组：var arr = ["吴白彬","23"];如何访问：arr[0];关联数组关联数组：下标都是自定义名称的数组关联数组可以让每个元素都有专门的名称，...
2018-08-20 18:04:14
415
原创 小程序进阶总结
图片首先，先说一下小程序的背景图片问题：在wxmlz中的style写：background-image:url("背景图片的路径")；background-report:no-report;background-size:100%;其中url仅支持网络图片。所以我们如果要用本地图片还是用定位来写吧。说完背景图现在来说一下小程序中上传图片（图片要转base64）。思路是这样的：因为小程序中的...
2018-08-11 10:47:17
1412
原创 小程序的基础心得
pagepage是小程序的主体内容部分。小程序的页面全部都放在page文件夹下。utilsutils中的utils.js是写好了的时间js。你可以在其他页面中调用，你就可以获取当前的时间。例子：js中：var util = require('utils.js的路径');Page({data: {},onLoad: function () {//调用函数时...
2018-07-22 15:55:58
632
原创 JQuery实现手风琴特效
HTML<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>手风琴特效</title> <link rel="stylesheet" href=".
2018-06-27 14:55:23
780
原创 JQuery实现带左右按钮的无缝轮播
带按钮的无缝轮播的原理是：在ul的两边多加两张图，在轮播的过渡的过程中就不会有空白的部分。HTML部分<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>带按钮的轮播</title> &
2018-06-27 10:28:54
1493
原创 JQuery实现图片无缝轮播
HTML部分<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>轮播</title> <link rel="stylesheet" href="..
2018-06-26 16:50:23
319
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人