- 博客(32)
- 资源 (5)
- 收藏
- 关注
RSS订阅原创 关于遍历，看这篇文章就足够了【find()、findIndex()、forEach()、splice()、slice()详解】
在日常写JS逻辑的时候，有小伙伴经常问及我一些遍历相关的逻辑，很多都是很基础性的知识点，只不过需要组合一下就可以实现效果。所以，我觉得还是有必要举几个例子来说明一下这几个js常用的方法，find()、findIndex()、forEach()、splice()、slice()这几个方法是我平时碰到的自己处理以及别人问及我，最常被问到的几个方法。首先，构造一些json数据 let al...
2019-03-31 10:52:35
922
原创 关于React中上传头像 / 图片的那点事, 这样做就对了
项目需求:在React中实现用户头像的上传,可能有人就说了,网上针对头像上传的库简直不要太多哦,什么AntDesign、Material等等. 但是为了一个小小的上传需求就将一个很大的库引入到项目中, 是不是有点欠妥.先上最终实现图:最开始考虑的是用html原生的 <input type="file" />方式, 但是在尝试的过程中,发现涉及到各种上传七牛凭证
2018-12-29 12:13:41
6992
2
原创 React 实现验证码倒计时功能
React 实现验证码倒计时功能export default class Register extends React.Component { constructor(props) { super(props) console.log(props) this.state = { count: 60, // 秒数初始化为60秒 liked:...
2018-08-01 15:56:30
8080
8
原创 如何改写原生input type="radio"的样式
默认的radio样式：需要实现的效果：<html lang="zh-CN"><head></head><body> <div class="input_radio"> <input type="radio" name="item" valu
2018-06-07 18:44:19
4363
原创 React + css3 实现circle圆环进度条加载
【需求效果图：如上图所示】需求：动态获取不同的分数，圆环展示对应的百分比分数值:正确率 70%以下提示文案：还需要继续加油哦~正确率 70% - 90%以下提示文案：不错，再加把劲~正确率 90%及以上提示文案：真棒！ 数据描述：不同的测试分数显示不同的分数百分比 百分比分数字段：score因为分数是动态获取的，所以 在React中，肯定是需要通过state来更改分数...
2018-04-13 11:02:44
4103
3
原创 Ubuntu：Sublime3 安装
Ubuntu 14.04 64位 1.添加sublime-text-3软件包的软件源sudo add-apt-repository ppa:webupd8team/sublime-text-32.更新系统软件源sudo apt-get update3.安装sublime-text-3sudo apt-get install sublime-text-instal...
2018-03-21 20:45:51
313
原创 【解决】移动端设备·横竖屏时页面内容字体大小调整的问题
【解决】移动端设备·横竖屏时页面内容字体大小调整的问题首先判断是不是横竖屏导致的问题，所以要代码检验一下。 window.orientation 对象在手机上才可生效。 添加属性text-size-adjust: 100%;即可 ～
2017-11-20 19:11:03
4142
原创 css 实现 section(块) 的左右滑动，以及块内文字居中的效果
css 实现 section 的左右滑动，和文字居中的效果，块内 拖动元素，左右滑动。css的原生实现，很方便。
2017-09-15 10:53:08
4102
原创 CSS／JS 实现滑动页面，到一定位置，position 定位设置为fixed,否则用absolute;
当我滚动页面的时候，在可视区域的时候，我想让顶部的导航区域随着我页面的滚动一起滚动，但是当页面移动到一定位置的时候，如果还是使用postion:alsolute；来进行定位的话，顶部导航就回随着我页面的移动而移动。不会将导航下面的内容移动后，就自动以position:fixed的样子来显示顶部导航区域。下面我放一张京东的导航图的效果，更直观的显示，我想要实现的大致操作。注意顶部京东搜索的那个框：想要
2017-08-25 11:24:36
21347
3
原创 javascript 禁止下拉页面 “橡皮筋“效果
下拉显示的顶部深灰色区域即是橡皮筋效果1.第一种document.body.addEventListener('touchmove', function(event) { console.log(event.source); //if (event.source == document.body) event.preventDefault(); }, { passive
2017-08-25 10:49:04
2103
原创 仿微信移动端的底部导航切换，显示高亮文字和图片
在实现移动手机端的操作时，难免会需要用到切换icon 高亮的操作，下面就来说说切换这点事。因为之前没写过这养分开切换显示的操作，只写过针对当前对象进行切换，但是，其实原理和思路很简单：就是点击选中当前元素，改变当前元素的显示效果，当切换另一个元素的时候，移除当前元素的状态，将切换后的元素加上高亮的显示效果。我首先想到的就是使用javascript的removecClass和addClass来进行操作
2017-08-23 13:09:24
9310
7
原创 触摸屏幕，滚动页面内容到底部，上拉刷新显示数据
今天学习的新知识点1.上拉页面到底部，刷新数据 $(document).ready(function() { $(window).scroll(function() { //获取垂直滚动的距离 var scrollTop = $(document).scrollTop(); console.log(scrollTop);
2017-07-03 22:58:08
1134
原创 CSS 点击事件on 和onclick有什么区别？ // CSS关于文本的那几个实用的属性
2.CSS文本2.1white-space: pre-line; 强制文字进行换行，前提是在文本中要先在文字中加” \n “，这样css识别出来在此处进行强制换行。word-wrap:normal | break-word, break-word可以将内容在边界内换行（不截断英文单词的换行）。点击事件on和onclick 两者之间的区别（很重要。。。
2017-07-03 22:51:09
9014
原创 关于CSS 伪类及伪元素
CSS 属性：font: bold 20px/30px Arial; 意思代表的是：font-weight: bold; font-size: 20px; line-height: 30px; font-family: Arail; 伪类和伪元素伪类用:表示，有foucs , hover , active等 伪元素用::表示 ， 有before , after 之所以有单冒号和双冒号
2017-07-03 22:33:28
348
原创 js点击缩略图,整屏居中放大图片
需要实现的效果图： 今天开发的时候，遇到要点击缩略图之后居中显示图片的大图查看（大致效果如上图所示）~想了好几种实现方式，最开始的时候，是想通过animate来点击图片进行显示，可是后来当我想要让放大的图片进行居中显示和点击别的地方隐藏已显示的大图的时候，才发现实现起来有难度。1 第一张点击图片将图片放大 。。。
2017-07-03 22:23:59
19792
6
原创 CSS 实现触屏【图片文字】左右滚动效果
实现一个css 来控制图片和文字的左右拖动的效果。具体的效果图 如下图所示：最开始的时候，产品给了我一张静态图片，让我按照这个来是实现页面。跟我说了一下说是可以播放滑动的。我以为是让我写一个轮播图。后来才知道是手动触碰进行拖放。遂决定直接用css来实现。
2017-06-14 19:16:51
8387
原创 【H5开发】ubuntu(virtualBox)上通过桥接方式配置ip供手机端访问
最近因为开发H5，需要在手机上进行查看，修改。之前在windows上开发的时候，在手机端查看页面的话，是通过nginx来进行配置和访问的。但是zai virtual-box上跑ubuntu的时候，就出现了问题，因为nginx无法配置，所以这里只能通过桥接配置的方式，把windows上本地的ip地址和ubuntu系统的ip地址配置到virtual-box才可以进行访问。 好了，话不多说，直接上配置
2017-06-08 14:53:32
694
原创 最简洁高效的Git 命令上传代码【以及Git的一些经常使用的小命令】
最开始设置git的时候，需要配置用户名和邮箱地址： git 新建/修改用户名和邮箱地址git config --global user.name "username"git config --global user.email "email" 查看用户名和邮箱地址git config user.name git config user.email ...
2017-06-03 16:27:33
583
原创 Virtual-Box Ubuntu 16.04 你应该这样来安装Chrome google 浏览器
最近写一个项目需要用到ruby来进行开发，但是作为一个只能在windows pc 上来开发的程序员来说，固然需要在windows上做一堆的配置。已经把我搞的疯掉了，没钱买mac就只能VirtualBox上搭一个ubuntu来进行开发了。这里需要下载chrome的浏览器，毕竟前端chrome是必备的调试工具。 下面是干货：1.先下载chrome.deb到本地，现在链接地址：.......
2017-06-03 01:23:44
1056
原创 关于正则表达式，你应该会用到的一些知识
说正则表达式之前，先来两个案例参考~关于正则基础的讲解。希望你能有所收获验证身份证号reg = /^[1-9]\d{5}[1-9]\d{3}((0\d)|(1[0-2]))(([0|1|2]\d)|3[0-1])\d{4}$/;验证邮箱email = /^(\w-*\.*)+@(\w-?)+(\.\w{2,})+$/;
2017-05-24 18:12:09
412
转载 你应该需要了解到的 【HTTP状态码 】
200 OK 服务器成功处理了请求（这个是我们见到最多的）301/302 Moved Permanently（重定向）请求的URL已移走。Response中应该包含一个Location URL, 说明资源现在所处的位置304 Not Modified（未修改）客户的缓存资源是最新的， 要客户端使用缓存404 Not Found 未找到资源501 Internal Server Error服务器遇到一个
2017-05-21 15:45:43
580
5
原创 Sublime Text 3 配置以及使用
安装sublime 【sublime text 3 官网下载】：http://www.sublimetext.com/3之后安装包配置 【包配置地址】：https://packagecontrol.io/installation 打开sublime text 3.exe，快捷键ctrl+ (注：chtl+,点的符号为英文输入法下的tab键上面的那个符号)或者View > Show Consol
2017-05-06 15:19:15
563
原创 vue项目框架结构入门 及 vue基础
vue框架使用说明1.目前后台框架主要运用了Bootstrap，用Vue模板去渲染数据。 2.运用webpack进行打包压缩加版本号，并实时监控页面变化,使用命令npm run dev启动 如上图所示（除dist外，README.md是介绍，通过npm install安装的node_module中有些配置需要修改） 1） build和config文件主要是webpack打包和端口的信息配置
2017-05-03 00:25:47
23197
5
原创 在七牛云上做wordpress 的镜像加速
因为wordpress提供的存储空间有限,只有几个G的存储,所以,鉴于博客日后会经常更文,且会放置大量的图片,也把一些css、html、javascript ,所以申请了七牛云,在七牛上做了wordpress的镜像加速。在做加速之前,需要在wordpress上做一些准备工作,首先需要在wordpress中安装插件 【 WPJAM七牛镜像存储、 WPJAM BASIC 】如果需要使用【WPJAM七牛镜
2017-05-01 22:21:48
5679
原创 sublime text 3 插件 【编写高质量 JavaScript & CSS 代码】高亮提示用户编写的代码中存在的不规范和错误的写法
作为一个高逼格的前端开发者，自然编辑器的高大上决定了我们码代码的速度;sublime作为轻型的开发编辑器,一直以来都以简洁,占用空间小,启动速度快,主题鲜明等 广为开发者所喜爱;今天给大家介绍一款sublime 一个强大的插件，叫 SublimeLinter ，这款插件是为了更好的编写高质量 JavaScript & CSS 代码，因为它可以 高亮提示用户编写的代码中存在的不规范和错误的写法；诸如
2017-05-01 22:20:06
2751
2
原创 sass简单入门学习
首先安装sass,先要下载ruby,因为sass是基于ruby做的开发;ruby地址下载链接,我用的是Ruby2.3.3这个版本安装ruby的时候记得勾选 Add Ruby executables to your PATH，直到 Ruby 安装程序完成 Ruby 安装为止。如果您的安装没有适当地配置环境变量，接下来您可能需要进行环境变量的配置。安装完ruby之后,cmd终端执行, ruby -v
2017-05-01 22:17:01
278
原创 密码框的明密文(显示和隐藏) 显示
最近在写一个新的项目,从头开始写,所以就要从注册登录开始做起.以前写登录注册模块的时候,无外乎给input框一个type=”password”就可以了,近期因为要涉及到显示隐藏状态的切换.样式代码如下:注:1.样式展示():ul> li class="phone bgImg"> input type="text" id="phone" maxlengt
2016-12-19 21:35:09
52159
30
原创 thinkphp阶段性学习小结
暑假刚实习的时候,面试的是PHP的岗位,过了2个多月,因公司业务需要,PHP岗位被取消掉.之后便转为web端,从此开始了web的实习生涯.关于tp的学习,之前整理的一些东西,拿出来做下分享~ 7月份刚来公司那会,每天并没有什么事情可以做,带我的人虽然前后端都吃的开,但是,很少派任务给我做,多半的时间也都是我自己一个人捧着一本书或者是视频在那里自己学习.那时候刚接触公司的php框架部分,学习的信心
2016-12-15 13:37:25
355
原创 注册页面 , 验证码倒计时代码的实现
近期因为开发一个新的H5+backbone 项目,验证输入手机号 验证码倒计时#如上图所示 要实现验证码的倒计时的效果首先做页面的布局理清楚页面效果需要实现的逻辑思路对手机号及验证码和密码做正则的规则校验前端样式布局代码<ul> <li class="phone bgImg"> <input type="text" id="phone" maxlength="11
2016-12-15 00:52:45
1213
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人