- 博客(26)
- 收藏
- 关注
RSS订阅转载 记录个人数组、字符串自己常忘记的方法，以及ES常用处理方式
记录自己在工作中，时不时使用，每次都要去查一下的基础方法。以及ES6经常使用的方法一、Array1、concat 合并数组2、shift 获取数组第一个元素 unshift 向数组首位添加一个元素3、pop 获取数组中最后一个元素4、slice 截取数组5、splice 对数组的增删改/* * concat 合并数组 * 该方法并不会改变原有...
2018-02-24 15:53:00
157
转载 解决webpack vue 项目打包生成的文件，资源文件均404问题
最近在使用webpack + vue做个人娱乐项目时，发现npm run build后，css js img静态资源文件均找不到路径，报404错误。。。网上查找了一堆解决办法，总结如下一、首先修改config目录下的index.js文件将其中build的配置项assetsPublicPath进行修改，改为目的是将资源文件的引入路径，改为相对地址（相对inde...
2018-01-08 17:11:00
445
转载 js 复制粘贴功能记录
最近工作中需要在前端页面中使用代码完成剪贴板的读写，网上搜索了下相应的资料，记录下...这个功能有两个办法一个是js方式，一个是使用flash一、JS方法1、复制首先复制的过程分为两步曲，无论是使用手工还是代码，先来看看手工的a、使用光标选中内容 b、通过ctrl + c 进行复制其实在代码端也是一样，以此用这个步骤来，html代码如下1 <h...
2017-11-23 10:29:00
176
转载 记录下工作中使用的pdf.js
在工作中遇到一个通过网页的形式浏览pdf文件以及图片的需求，图片简单，直接通过网页的形式打开这个图片的URL即可。而pdf这边，通过查询发现有一个名为pdf.js的神器。 简单介绍下，它可以在html中直接浏览pdf文件，pdf的每一页数据，通过H5的canvas进行解析，以及显示。其中还可以操作页数、滚动、打印、下载等功能。git上的地址为：http://mozilla....
2017-11-10 17:05:00
639
转载 记录下jplayer的简单demo
jplay一个播放器的工具包，依赖于jquery或者zepto，有zepto所以相当于是PC和移动都支持。它的官方文档为：http://www.jplayer.cn/同时也推出的react的支持包，具体参考：https://github.com/jplayer/react-jPlaylist所以还是蛮好用的一个工具以下是自己要使用时，写的个小demo，自己留存以便以后参考...
2017-09-13 15:59:00
180
转载 js 函数节流
在JS中，函数的调用大多数都是由用户主动调用触发，但是在有的事件中，比如mousemove、window.onresize、touchmove中，函数的调用次数会非常频繁，从而消耗浏览器大量的内存空间，造成浏览器卡顿甚至假死的问题。所以函数节流的目的就是减少函数在这些事件中的调用次数，从不可控制到可控。 函数节流的实现方式有很多中，通用的原理就是使用setTimeout函数，延...
2017-09-08 15:37:00
113
转载 用ajax与fetch调用阿里云免费接口
最近学习态度比较积极，打算用react做一个小个人应用网站...所以从阿里云上买了些免费的接口，什么QQ音乐排行查询接口、IP地址查询、天气预报等等。调用时，发现身份校验可以通过简单修改头部信息的方式，即向头部加入APPCODE的key，以及相应的值。 但是之前没有用过请求头添加 so 记录学习下...一、首先直接放demo1、jQueryvar re...
2017-09-07 12:29:00
281
转载 简要谈谈javascript bind 方法
最近去参加了场面试，跟面试官聊了很多JS基础上的东西，其中有个问题是谈谈对apply、call、bind的理解和区别。顿时一愣，apply、call我知道，经常用的东西，bind是什么鬼！！！好像见过，也瞅过类似的文章，但是...不记得了...难道和jQuery的事件绑定的bind一样... 既然不知道，那就整理总结下啰~一、apply和call 既然提到提...
2017-09-03 22:23:00
148
转载 h5启动原生APP总结
许久没有写博客了，最近有个H5启动APP原生页面的需求，中间遇上一些坑，看了些网上的实现方案，特意来总结下一、需要判断客户端的平台以及是否在微信浏览器中访问1、客户端判断在启动APP时，Android和IOS系统处理的方式是不一样的，Android这边由于开放，可以在浏览器中通过<a>标签以及meta标签的方式，让浏览器app获取手机打开应用的权限进而启动APP。...
2017-06-23 16:01:00
292
转载 mac上安装mongoDb以及简单使用
年初粗略学习了下node，这好几个月没玩，突然发现已经忘完了，还是简单记录下基本知识，方便再次使用时资料查找。一、mongoDb安装在mac上安装了brew的情况下，可以直接执行命令brew install mongodb，在mac系统中往往因为需要写入权限而要加入sudo然后等几分钟就安装好了1、mongoDb启动 第一个终端窗口输入 sudomongod ...
2016-07-24 10:02:00
88
转载 mac快捷键整理以及node的基本使用
该文章是作为日常积累和整理，又是好久没有整理node的相关知识了，最近翻了翻自己的有道云笔记，怎一个乱字了的，重新整理下。一、Mac常用快捷键Command+M: 最小化窗口Command+T: 在浏览器中打开新的选项卡Command+W: 关闭窗口Command+Q: 退出程序Command + R: 刷新页面Command+Shift+3:全屏截图C...
2016-07-23 22:58:00
332
转载 html5视频video积累
又是好几个月没有写东西，还是太懒散了~必须要教育下自己罗~这次做了个播放视频的移动H5，之前没有仔细玩过，好好记录下基本知识，还有遇到的一些坑，方便之后再次遇见后进行解决一、基本video标签在兼容性上还是比较差的，如果要在页面中使用video标签，需要考虑三种情况，支持Ogg Theora或者VP8的（Opera、Mozilla、Chrome），支持H.264的（Sa...
2016-07-13 15:35:00
230
转载 整理下PC和移动获取点击、移动坐标的代码和坑
一、PCPC是通过鼠标点击和移动，相对比较简单，比如onmousedown、onmouseup、onmousemove、onmouseout鼠标按键按下、按键起来、鼠标在元素上移动、鼠标从元素上离开。canvas.onmousedown = function(e) { console.log(e.clientX, e.clientY);}canvas.onm...
2016-03-30 16:46:00
251
转载 html5 实现简单的上传
简单记录下今早做H5上传中一些代码还有坑一、展示因为前端上传文件是必须通过form表单的，不能使用ajax，这样的话一个移动页面放入一个type为file的input真心不怎么好看，如下图，很挫有没有解决办法找了下，PC上有些是把这个input换成flash，采用jquery的工具库比如uploadify来做，但是移动端大部分浏览器是不支持flash的。所以最后采用的办法...
2016-01-20 15:24:00
469
转载 canvas基础学习（四）
今天逛天猫时，看见优衣库店铺首页有个这个飘雪效果，顿时觉得好酷炫，立马从里面copy代码进行学习。之前我也做过一些canvas特效，往往在canvas全屏时，canvas下层的div就无法进行dom的事件操作，点击之类的就失灵了。之前我的做法要么就是在canvas上加入点击事件，穿透到下层，或者把下层的div通过z-index属性放在canvas的上层。这种办法都显得死板或者展现...
2015-12-27 14:27:00
160
转载 canvas基础学习（三）
一、图片加载控件在canvas效果制作中常常要使用多张图片，为了提高用户体验，需要给用户提供一个图片加载中的过度页面效果。过度效果，我在项目中使用的是Sonic.js，它在git上的地址为https://github.com/padolsey/Sonic，个人认为它的样式和扩展性都还不错，使用方式也比较简单。效果图为：调用代码也比较简单<script type=...
2015-12-08 14:14:00
162
转载 canvas基础学习（二）
一、图像绘制canvas绘制图像的方法是ctx.drawImage();该方法有三种使用方式1、ctx.drawImage(img,x,y);img是指图像对象，x和y分别是这个图像左上角在canvas画布的坐标，而图像显示的大小为图像本身的像素值，超出canvas画布的部分不显示。2、ctx.drawImage(img,x,y,w,h);和上面的那个函数相比，可以控...
2015-11-25 14:48:00
454
转载 canvas基础学习（一）
一、概述canvas它和其它的HTML5标签的使用基本一致，但是它相当于在浏览器中建立一个画布，可以再这个画布上画图、创建动画甚至是3D游戏。由于canvas要适配不同终端的分辨率，所以尽可能的在标签内设置高度和宽度，这个也符合W3C的标准。代码格式如下，当浏览器不支持canvas标签的时候，会显示其中的文字。<canvas id="main" width="800" ...
2015-11-20 17:25:00
151
转载 移动端使用百度分享代码
最近看了一些关于分享自媒体的代码，最后在在项目中使用了百度的分享代码，百度分享的代码格式，如下<div class="bdsharebuttonbox" data-tag="share_1"> <!-- 此处添加展示按钮 --></div><script> window._bd_share_config ...
2015-11-15 12:03:00
423
转载 基于zepto移动4*3九宫格转奖
最近根据公司需求，要把移动端的圆形转盘抽奖，改为九宫格的形式，查找资料搞定了，纪录下demo代码。页面的展现样式，如下比较简单，就是红色的背景图，在这10个格子里转动具体代码如下html<!DOCTYPE html><html> <head lang="cn"> <meta charse...
2015-11-12 14:20:00
213
转载 记录下页面懒加载代码
今天京东在做图书品类的活动，买了几本心仪的书，闲暇之余看了看京东图书促销页前端代码，有很多的工具类js文件，如用于cookie、跨域、数组、业务方面等。突然看到了页面懒加载代码，做下记录。/** * 图片懒加载 */(function(){ if(jQuery.fn.lazyLoad) return; jQuery.fn.lazyLoad = fu...
2015-11-01 10:05:00
119
转载 html实现摇一摇并震动
今天收到了领导的通知，要APP和触屏完成摇一摇的功能，本来通过IOS调用原生还是蛮方便的，但想如果采用web前端的方式应该是实现不了的，马上就开始推脱了。可惜领导告知微信京东购物，不仅仅有摇一摇还有震动的功能，顿时就打脸了，下来后立即谷歌，查找代码写出demo，哈哈。 通过查找资料发现window.DeviceMotionEvent该事件可以监听设备的运动事件，然后通过even...
2015-10-12 10:32:00
237
转载 web前端绘制0.5像素的几种方法
最近完成了公司安排的移动web触屏开发，期间涉及到在移动设备上显示线条，最开始采用PC常用的css board属性来显示1个像素的线条，但是发现在移动设备上并不美观，参考淘宝、京东的触屏发现它们均是采用浅细的线条来显示在移动设备上。 以下纪录了比较方便的4种绘制0.5像素线条方式一、采用metaviewport的方式，这个也是淘宝触屏采用的方式常用的移动html vi...
2015-10-12 10:13:00
366
转载 基于zepto使用swipe.js制作轮播图demo
在移动web开发中，由于手机界面较小，为了能展示更多的图片经常使用轮播图并且还需要考虑到手机流量的问题，通过请教他人以及百度，个人感觉swipe.js比较好用它是一个纯javascript工具，不需要跟其它js库一起导入，同时兼容jQuery和zepto，压缩版的大小只有6kb很适合移动端的开发，它的git地址如下https://github.com/thebird/swip...
2015-08-27 15:28:00
235
转载 IOS 实现banner循环轮播
在项目中把banner图片UIImageView一张一张的放入UIScrollView中，通过设置UIScrollView的pagingEnabled属性为YES，则可以做到当用户滑动banner时图片一张一张的显示，但当用户想从第一张图到最后一张图，或者从最后一张图到第一张图的时候就会卡住，简单点的做法就是判断用户swipe的方向，然后让UIScrollView自动滑动到最后一张或...
2015-08-25 17:02:00
151
转载 zepto不支持animate({scrollTop:"100px"})的解决办法
在移动web项目的开发中，遇到一个通过点击页面自动到相应的楼层处的需求，最初的想法就是使用html的target属性进行切换，但实际效果十分死板，显得毫无交互性。该前端架构采用zepto这个轻库进行开发，它具有类似jQuery的语法，之后采用了animate({scrollTop:"100px"})这个函数进行页面的动画滚动，结果就是毫无效果。 通过查询zepto fx包的源码...
2015-08-11 10:35:00
222
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人