- 博客(90)
- 收藏
- 关注
RSS订阅转载 几种比较和谐的文字背景颜色搭配
1背景色：＃F1FAFA″———做正文的背景色好，淡雅A2背景色：＃E8FFE8″———做标题的背景色较好A3背景色：＃E8E8FF″———做正文的背景色较好，文字颜色配黑色A4背景色：＃8080C0″———上配黄色白色文字较好A5背景色：＃E8D098″———上配浅蓝色或蓝色文字较好A6背景色：＃EFEFDA″———上配浅蓝色或红色文字较好A7背景色：＃F2F1D7″———配黑色文字素雅，如果是...
2018-03-29 17:38:47
47341
转载 100多个经典常用的jQuery插件大全实例演示和下载
100多个经典常用的jQuery插件大全实例演示和下载 更多 >07-31 cropped仿新浪微博头像上传裁剪缩小放大预览07-29 prettyPhoto和fancybox弹出层插件对比07-29 hwSlider支持手机app触屏滑动07-19 svgmap全国地图数据分布统计07-19 jQuery超级简单的绿色拖动验证码功能06-28 flot.js完美演示柱状
2018-02-03 15:14:34
1908
转载 纯 CSS 实现三角形尖角箭头的实例
[html] view plain copy> html xmlns="http://www.w3.org/1999/xhtml"> head> meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> title>无标题文档title> style typ
2018-02-01 17:19:55
1743
转载 几款常用的高质量web前端框架
Web前端框架就是为了节约开发成本和时间，一般开发一个项目都会用到前端框架（除非自己有前端开发团队），根据我经验找的几款web前端框架做出了分析。都是个人意见，仁者见仁智者见智。 QUICK UIQUICK UI是一套完整的企业级web前端开发解决方案，由基础框架、UI组件库、皮肤包、示例工程和文档等组成。使用QUICKUI开发者可以极大地减少工作量，提高开发效
2018-01-31 16:47:12
6747
转载 javascript 中的call（）和apply（）
Js apply方法详解 我在一开始看到javascript的函数apply和call时,非常的模糊,看也看不懂,最近在网上看到一些文章对apply方法和call的一些示例,总算是看的有点眉目了,在这里我做如下笔记,希望和大家分享.. 如有什么不对的或者说法不明确的地方希望读者多多提一些意见,以便共同提高.. 主要我是要解决一下几个问题: 1.apply和cal
2018-01-31 09:41:26
187
转载 个人主页优化
优化步骤（压缩并替换图片、删除多余代码以及请求、替换CDN，删除插件、使用优化插件）（1）压缩并替换图片；见上面第一张图片，可以看到一张图片几十k呢，我的网页加载就几百k，这就几十k了，必须改呀！！！给个压缩工具给大家先：智图压缩然后呢？把我们的主题拉下来，然和用上面的工具去压缩图片，替换就可以了。很简单吧。本博主是用FTP的原来的图片大小现
2018-01-30 11:56:42
294
转载 浅谈自适应网站的设计
移动化的浪潮席卷而来，自适应网站也应运而生。摆在程序员的面前只有一条路，那就是怎么实现它。根据小编的经验，仅提供以下3种自适应网站方案，且最后会简要分析下其优劣，以供读者分析使用什么形式的自适应网站。第一种：跳转适配——两套界面设计，相互独立。顾名思义就是识别出当前访问该网站的设备，然后跳转到相应的网站。当设备为手机时，网站跳转到手机版网站，当设备为笔记本或台式机时，网站跳
2018-01-30 11:23:57
393
转载 大前端必备网站
01.前端这个圈子社区/组织W3C TPAC w3ctech WebReBuild HTML5研究小组 阿里技术嘉年华 京/沪JS 前端圈HTML5梦工场 无障碍联盟国内综合前端观察 阮一峰 W3CPLUS W3CFUNS 大前端 W3HELP W3SCHOOL HTML5中国 前端乱炖F2E社区 MDNNEW国内个人CSS森林 twinsen 艾文王 余果 张鑫旭 大
2018-01-30 10:46:05
2353
转载 前端工程师必备的几个实用网站
一、配色类网站http://colorhunt.co这个网站给我们提供了很多的配色方案，我们直接使用就OK了。使用方法也很简单，鼠标移动到对应的颜色上，我们就可以看到颜色的十六进制码，复制这个颜色到工具里就可以使用了。https://webgradients.com/180种渐变方案供你选择，还可以直接复制CSS样式应用到网页中https://color.a
2018-01-30 10:41:20
411
转载 js实现视频截图
完整代码:html lang="zh-CN"> head> title>测试页title> meta charset="utf-8"> meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=no,maximum-scale=1,min
2018-01-27 11:00:33
6938
转载 应用canvas获取video的缩略图
发布视频时候，经常需要上传同时上传视频的缩略图，近日，应产品经理的的要求，需要做一个发布视频动态的功能，我第一反应就想到了H5的标签vidio和canvas，在这里记录下我完成该功能的过程：首先，整体思路是创建一个vidio，然后创建一个canvas和一个画笔，调用画笔的drawImage方法，将vidio作为参数，就会画出该视频的缩略图。二话不说撸代码：function crea
2018-01-27 10:56:08
3247
原创 HTML行内元素、块状元素、行内块状元素的区别
HTML可以将元素分类方式分为行内元素、块状元素和行内块状元素三种。首先需要说明的是，这三者是可以互相转换的，使用display属性能够将三者任意转换： (1)display:inline;转换为行内元素 (2)display:block;转换为块状元素 (3)display:inline-block;转换为行内块状元素1.行内元素 行内元素最常使用的就是s
2018-01-27 09:42:35
24583
转载 CSS中可以和不可以继承的属性
一、无继承性的属性1、display：规定元素应该生成的框的类型2、文本属性：vertical-align：垂直文本对齐text-decoration：规定添加到文本的装饰text-shadow：文本阴影效果white-space：空白符的处理unicode-bidi：设置文本的方向3、盒子模型的属性：width、height、mar
2018-01-22 16:22:13
247
转载 看完让你彻底搞懂Websocket原理
偶然在知乎上看到一篇回帖，瞬间觉得之前看的那么多资料都不及这一篇回帖让我对 websocket 的认识深刻有木有。所以转到我博客里，分享一下。比较喜欢看这种博客，读起来很轻松，不枯燥，没有布道师的阵仗，纯粹为分享。废话这么多了，最后再赞一个~一、websocket与httpWebSocket是HTML5出的东西（协议），也就是说HTTP协议没有变化，或者说没关系，但HTTP是不支持持久连接的（长连
2018-01-19 11:46:34
189
转载 Jquery超简单遮罩层实现代码
在开发中，为了避免二次提交，遮罩层的运用越来越普遍看了很多代码，下面跟大家分享一下我认为最简单的遮罩层实现方式：1.样式如下设置：CSS代码：[html] view plain copystyle type="text/css"> .mask { position: absolute; top: 0px; filter: alpha(opacit
2018-01-18 11:06:22
2894
转载 JavaScript 中的apply（）和call（）
Js apply方法详解 我在一开始看到javascript的函数apply和call时,非常的模糊,看也看不懂,最近在网上看到一些文章对apply方法和call的一些示例,总算是看的有点眉目了,在这里我做如下笔记,希望和大家分享.. 如有什么不对的或者说法不明确的地方希望读者多多提一些意见,以便共同提高.. 主要我是要解决一下几个问题: 1.apply和call的区别在哪里
2018-01-18 09:03:35
169
转载 HTML5 canvas绘图基本使用方法
是HTML5中新增的标签，用于绘制图形，实际上，这个标签和其他的标签一样，其特殊之处在于该标签可以获取一个CanvasRenderingContext2D对象，我们可以通过JavaScript脚本来控制该对象进行绘图。只是一个绘制图形的容器，除了id、class、style等属性外，还有height和width属性。在>元素上绘图主要有三步：获取元素对应的DOM对象，这是一个Can
2018-01-17 09:53:16
434
转载 HTML 5 Canvas
HTML5 标签用于绘制图像（通过脚本，通常是 JavaScript）。不过， 元素本身并没有绘制能力（它仅仅是图形的容器） - 您必须使用脚本来完成实际的绘图任务。getContext() 方法可返回一个对象，该对象提供了用于在画布上绘图的方法和属性。本手册提供完整的 getContext("2d") 对象属性和方法，可用于在画布上绘制文本、线条、矩形、圆形等等。
2018-01-17 09:53:04
225
转载 JS中typeof与instanceof的区别
JavaScript 中 typeof 和 instanceof 常用来判断一个变量是否为空，或者是什么类型的。但它们之间还是有区别的：typeoftypeof 是一个一元运算，放在一个运算数之前，运算数可以是任意类型。它返回值是一个字符串，该字符串说明运算数的类型。typeof 一般只能返回如下几个结果：number,boolean,string,function
2018-01-16 18:29:08
294
转载 HTML canvas createLinearGradient() 方法
本文参考菜鸟教程网做的整理笔记html>head> meta charset="utf-8"> title>HTML5 之颜色渐变(runoob.com)title> head>body>canvas id="myCanvas" width="200" height="100" style="border:1px solid #d3d3d3;">您的浏览器不支持 HTML5
2018-01-16 18:22:35
445
转载 CSS3的calc()使用
calc()对大家来说，或许很陌生，不太会相信calc()是css中的部分。因为看其外表像个函数，既然是函数为何又出现在CSS中呢？这一点也让我百思不得其解，今天有一同事告诉我，说CSS3中有一个属性能实现自适应的布局，首先让我想到的是box-sizing，但跟我说还可以计算，这让我不得不想起calc()。因为早先在官网和一些blog上看到相关的介绍，但一直没有深入，也没有自己去测试过。今天花了一
2018-01-16 15:43:56
278
转载 客户端js判断文件类型和文件大小即限制上传大小
由于项目需要！需要脚本在客户端判断大小和文件类型！自己网上找资料找的好辛苦！索性自己写了一个并测试 文件上传大小限制的一个例子，兼容ie6，ie7，ie8 ，Google Chrome，ff等浏览器 转自：http://www.jb51.net/article/43498.htm复制代码代码如下: var isIE = /msie/i.test(nav
2018-01-15 16:48:29
2794
原创 JavaScript中的&&和||
&&表示“与”,x和y均为true,取值是true，否则取值是false||表示“或”两个布尔值中任何一个值为TRUE（或者两个都为TRUE），则返回值为TRUE。如果两个运算符都是FALSE，则返回值为FALSE。a() && b() :如果执行a()后返回true，则执行b()并返回b的值；如果执行a()后返回false，则整个表达式返回a()的值，b()不执行
2018-01-15 16:25:52
196
转载 微信小程序 前端源码逻辑和工作流详解
看完微信小程序的前端代码真的让我热血沸腾啊，代码逻辑和设计一目了然，没有多余的东西，真的是大道至简。废话不多说，直接分析前端代码。个人观点，难免有疏漏，仅供参考。文件基本结构： 先看入口app.js，app(obj)注册一个小程序。接受一个 object 参数，其指定小程序的生命周期函数等。其他文件可以通过全局方法getApp()获取app实例，进而直接调用它的属性
2018-01-13 18:18:01
582
转载 开发 | 手把手教你实现微信小程序中的自定义组件
之前做小程序开发的时候，对于开发来说比较头疼的莫过于自定义组件了，当时官方对这方面的文档也只是寥寥几句，一笔带过而已，所以写起来真的是非常非常痛苦。好在微信小程序的库从 1.6.3 开始，官方对于自定义组件这一块有了比较大的变动，最直观的感觉就是文档比以前全多了。还有就是，现在小程序支持简洁的组件化编程，可以将页面内的功能模块抽象成自定义组件，以便在不同的页面中复用，提高自己代码的
2018-01-13 16:54:05
1009
转载 canvas学习笔记——关于css设置canvas画布大小的问题
canvas的绘制会是画布大小为准的。canvas的默认画布大小为300×150。通常，我们可能想要改变画布的大小，以下是大家最容易想到的方法：//方法一：内联样式"width:450px;height:300px;">//方法二：内部样式"text/css"> #myCanvas { width: 450px; height:300px;
2018-01-12 18:25:44
5120
转载 微信小程序 教程之wxapp视图容器 scroll-view
scroll-view可滚动视图区域。属性名类型默认值说明scroll-xBooleanfalse允许横向滚动scroll-yBooleanfalse允许纵向滚动upper-thresholdNumber50距顶部/左边多远时（单位px），触发 scrol
2018-01-12 15:30:00
698
转载 微信小程序实现图片放大缩小，并截取指定区域图片
要在小程序中实现图片放大缩小是着实不容易呀，还要把用户选择的指定区域生成图片，简直令人发指。不多说，上烧鸡（代码）首先还是先来看看要实现的效果用户可以在指定的区域中滑动，放大，缩小自己的图片，点击确定之后，把方框中的区域生成图片。这个和上传头像功能差不多。首页我们要做的就是怎么才能让照片完美的显示在页面。图片一般分为横版和竖版图片，这两种情况要分开显示。
2018-01-12 15:06:01
8667
4
转载 用H5中的Canvas等技术制作海报
在去年的时候也实现过合成海报的功能，不过当时时间仓促，实现的比较简单。就一个旋转功能，图片也不能拖动放大，也不能裁剪。去年的实现可以参考《移动图片操作--上传》和《移动图片操作--预览旋转合成》这次有时间就实现一个功能稍微多点的海报。 一、概要第一屏第二屏第三屏总共有
2018-01-12 11:17:11
594
转载 移动端图片操作（一）——上传
传我们一般都是用“input[type=file]”控件。当你用此控件时，你就授权了网页和服务器访问对应的文件，就可以得到File对象。友情提示在，在Android手机webview中，是不支持上传文件的，网上说是修改Android端的代码，但我没试过，我们这边是使用客户端提供的接口来实现上传的。下面的示例代码可以在这里查看到。一、accept属性该属性表明了服务器
2018-01-12 11:07:26
611
转载 jQuery源码学习笔记
整个jQuery是一个自调用的匿名函数： 1 (function(global, factory) { 2 if (typeof module === "object" && typeof module.exports === "object") { 3 module.exports = global.document ? 4 fa
2018-01-12 10:44:48
165
转载 基于JSON+JQuery实现的多条件筛选功能(类似京东和淘宝功能)
首先看一下实现效果：现在JSON用于数据的封装和管理越来越流行，一直想着通过JSON实现很多的小工具，比如多条件筛选、表格定制化、数据验证、tree树等等，最近没事就用JSON和JQuery实现了类似于京东和淘宝多条件筛选功能，下面会对代码进行解释，并有对应的demo提供给大家。 //加载事件 var data=[{ "url":"
2018-01-10 18:21:22
7465
转载 web前端开发常用的几种图片格式及其使用规范
矢量图与位图矢量图是通过组成图形的一些基本元素，如点、线、面，边框，填充色等信息通过计算的方式来显示图形的。一般来说矢量图表示的是几何图形，文件相对较小，并且放大缩小不会失真。这里有一点要注意的是web开发中用到的图片都不是矢量图，即使是一个三角形，只有一个边框，都是位图。那么矢量图在哪里有用到呢？我目前的知识池就知道一个图标字体，比如 font-awesome
2018-01-10 09:46:13
6119
转载 异步上传图片方法
对于异步上传来说，如果仍想用文件直接上传方法的话，可以采用HTML5的FormData，具体操作可以参考这篇博客。http://www.cnblogs.com/lhb25/...本人还有另外一种异步上传图片的方法。先将图片转换成base64字符串，然后再把base64字符串提交到服务器上，服务器接收后，可以再用具体的API将base64字符串转换成图片内容。以下为具体实现方法：va
2018-01-10 09:45:24
579
转载 移动端样式小技巧
平时在移动端开发拼页面的过程中总会遇到一些问题，主要是各手机webview样式显示效果不一致造成的。以下总结了一些常见坑和一些小技巧，希望对看官有所帮助！本文只针对两大手机阵营 Android和IOS 中的魅蓝metal 和 iPhone6进行样式对比。一、line-heightline-height经常用于文字居中，当然也有小伙伴会用上下padding去写.but！不
2018-01-07 19:32:52
318
转载 移动端css公共样式
@charset "utf-8";/* 禁用iPhone中Safari的字号自动调整 */html { -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; /* 解决IOS默认滑动很卡的情况 */ -webkit-overflow-scrolling : touch;}/* 禁止缩放表单
2018-01-07 19:28:47
324
原创 常见的动态样式css语言之less
1.动态样式语言 CSS：静态样式语言，作为一门语言并不称职！缺少一般语言必需的基本要素：变量、运算、循环/选择、函数等，导致了CSS代码的修改和维护非常麻烦。 动态样式语言：在CSS的基础之上，添加了动态语言所必需的元素，如变量、运算、循环/选择、函数等，方便样式文件的修改和维护。 注意：浏览器默认只能处理静态样式语言，所有的动态样式语言必需设法转换为CSS才能被浏览器所理解！
2018-01-07 17:30:26
959
转载 移动端界面的适配
阅读目录适配的要求适配的方法，3个步骤适配中背景图片的处理适配的原理解析摘要：在进行移动端界面的书写的时候，如果把宽度高度或者字体大小全部写死的话，那么在所有手机上看到的大小都一样，存在的问题就是同样大小的字体，或者一个盒子模型，在大屏幕手机上看起来会有点偏小。比如iphone6PLUS。如果是做成适配的话，就很好的解决了这个问题，大屏幕显示的内容大一点，小屏幕显示的小一点
2018-01-07 16:39:50
495
原创 如何在手机上访问自己做的网页
前提：手机和电脑连接的是同一个路由器的网络。1.搭建服务器，用Apache2.把HTML文件放到服务器里面，打开浏览器能访问到服务器（localhost）里的HTML。3.查看本机的IP地址进入“网络和共享中心”（在控制面板可以进入，右单击左下角那个网络图标也可以进入），然后再点击已链接的网络，进入了“网络连接状态”窗口，点击“详细信息”在详细列表里我们就可以看到网络的
2017-12-27 19:04:23
13446
原创 js中的时间与日期处理
创建 Date 对象的语法：var myDate=new Date()var end_date=new Date(cur_issue_date.getTime()+1000*60*10*h);注释：Date 对象会自动把当前日期和时间保存为其初始值。Date 对象方法方法描述Date()返回当日的日期和时间。
2017-12-05 18:35:15
278
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人