- 博客(28)
- 资源 (2)
- 收藏
- 关注
RSS订阅Ajaxload动态加载动画生成工具的实现（ajaxload的本地移植）
前言前段时间看到一个国外的网站，在线生成ajax loading动画。觉得很实用，于是动起了移植到自己网站的念头（一直以来的习惯，看到好的工具总想着移植到本地好好研究）。根据以往移植的经验最终把 这个工具移植到自己网站上了，生成图片的核心还是用了原来网站的接口，所以这个功能的实现完全依赖于原网站，生成和下载图片的速度取决于网速，由于是国外 的网站，功能并不稳定。下面介绍下我移植的过程已经遇到...
2013-11-07 08:52:35
175
原创 Ajaxload动态加载动画生成工具的实现（ajaxload的本地移植）
前言前段时间看到一个国外的网站，在线生成ajax loading动画。觉得很实用，于是动起了移植到自己网站的念头（一直以来的习惯，看到好的工具总想着移植到本地好好研究）。根据以往移植的经验最终把 这个工具移植到自己网站上了，生成图片的核心还是用了原来网站的接口，所以这个功能的实现完全依赖于原网站，生成和下载图片的速度取决于网速，由于是国外 的网站，功能并不稳定。下面介绍下我移植的过程已经遇
2013-11-07 08:52:10
834
原创 用canvas实现图片滤镜效果详解之视频效果
这是一个很有意思的特效，模拟摄像机拍摄电视屏幕画面时出现点状颗粒的效果。颗粒的大小通过变换矩阵实现，可以任意调节，有兴趣研究的朋友可以尝试更多的效果，代码没有经过优化，只是一个粗糙的Demo，大家可以自行改进。
2013-11-05 08:19:17
1344
原创 用canvas实现图片滤镜效果详解之灰度效果
前面展示了一些canvas实现图片滤镜效果的展示，并且给出了相应的算法，下面来介绍一下具体的实现方法。前面介绍的特效中灰度效果最简单，就从这里开始介绍吧。
2013-11-04 08:16:39
1310
用canvas实现图片滤镜效果详解之灰度效果
前面展示了一些canvas实现图片滤镜效果的展示，并且给出了相应的算法，下面来介绍一下具体的实现方法。前面介绍的特效中灰度效果最简单，就从这里开始介绍吧。1.获取图像数据 img.src = ’http://bloglaotou.duapp.com/wp-content/themes/frontopen2/tools/filter/image2.jpg’; canva...
2013-11-04 08:16:12
201
原创 用canvas实现图片滤镜效果
1.灰度效果图片过滤效果之灰度效果算法及原理：.299 * r + .587 * g + .114 * b; 2.油画效果算法及原理：用当前点四周一定范围内任意一点的颜色来替代当前点颜色，最常用的是随机的采用相邻点进行替代。3.连环画效果图片滤镜效果之连环画效果算法及
2013-10-30 11:47:44
1592
用canvas实现图片滤镜效果
1.灰度效果图片过滤效果之灰度效果算法及原理：.299 * r + .587 * g + .114 * b; 2.油画效果算法及原理：用当前点四周一定范围内任意一点的颜色来替代当前点颜色，最常用的是随机的采用相邻点进行替代。3.连环画效果图片滤镜效果之连环画效果算法及原理：连环画的效果与图像灰度化后的效果相似,它...
2013-10-30 11:46:57
186
原创 通过javascript把图片转化为字符画
1.获取上传图片对象数据 Javascript无法直接获取本地上传的图片的数据，html5可以解决这一问题 。html5里面的FileReader interface可以把图片对象的数据读到内存，然后通过接口的进度事件（Progress Events）访问这些数据。浏览器支持：Internet Explorer: 10+Firefox: 10+Chrome:
2013-10-24 08:47:33
1608
2
通过javascript把图片转化为字符画
1.获取上传图片对象数据 Javascript无法直接获取本地上传的图片的数据，html5可以解决这一问题 。html5里面的FileReader interface可以把图片对象的数据读到内存，然后通过接口的进度事件（Progress Events）访问这些数据。浏览器支持：Internet Explorer: 10+Firefox: 10+Ch...
2013-10-24 08:46:47
348
原创 基于Html5的爱情主题网站–表白神器(第二版)
第二版在第一版的基础上增加了一个动态3D的白云效果背景，鼠标悬浮在页面上云朵会向屏幕Z轴方向运动，在第一人称视角看来向着云朵方向前进的，由此形成一个伪3D效果。有点绕，直接看demo就能理解了。3D白云效果是基于threejs框架做的。介绍下three.js:three.js是JavaScript编写的WebGL第三方库。提供了非常多的3D显示功能。Three.js 是一款运行在浏
2013-10-17 08:20:07
3865
基于Html5的爱情主题网站–表白神器(第二版)
第二版在第一版的基础上增加了一个动态3D的白云效果背景，鼠标悬浮在页面上云朵会向屏幕Z轴方向运动，在第一人称视角看来向着云朵方向前进的，由此形成一个伪3D效果。有点绕，直接看demo就能理解了。3D白云效果是基于threejs框架做的。介绍下three.js:three.js是JavaScript编写的WebGL第三方库。提供了非常多的3D显示功能。Three.js 是一款运行在浏览器中...
2013-10-17 08:19:11
403
原创 基于Html5的爱情主题网站–表白神器
介绍一个基于基于Html5的爱情主题，文字采用打字机效果，逐字打印，并带有键盘敲击声音。在chrome,safari,firefox,IE10下都有效，chrome下效果最佳。要注意的是safari下不支持audio标签属性没有声音效果（暂未解决）。技术要点文字效果采用本地化字体 @font-face动态的心型用到的是HTML5的canvas打字机声音效果采
2013-10-16 08:16:20
2771
1
基于Html5的爱情主题网站–表白神器
介绍一个基于基于Html5的爱情主题，文字采用打字机效果，逐字打印，并带有键盘敲击声音。在chrome,safari,firefox,IE10下都有效，chrome下效果最佳。要注意的是safari下不支持audio标签属性没有声音效果（暂未解决）。技术要点文字效果采用本地化字体 @font-face动态的心型用到的是HTML5的canvas打字机声音效果采用HTML5的au...
2013-10-16 08:15:06
318
原创 一个基于WebGL的仿真3D水池有逼真的水波纹效果
最近在研究WebGL，看到国外很多高手做的很多超炫的3D效果，无比羡慕。忍不住把效果趴下来研究，下面介绍一个逼真的游泳池中浮动小球的效果。效果非常绚丽，功能强大。示例可切换观察水池的视角，不同视角考虑到了光线从不同角度折射和反射的影响，所以波纹效果极其逼真。先介绍下WebGLWebGL是一种3D绘图标准，这种绘图技术标准允许把JavaScript和OpenGL ES 2.0结合在一起，通...
2013-10-15 12:45:54
684
原创 一个基于WebGL的仿真3D水池有逼真的水波纹效果
最近在研究WebGL，看到国外很多高手做的很多超炫的3D效果，无比羡慕。忍不住把效果趴下来研究，下面介绍一个逼真的游泳池中浮动小球的效果。效果非常绚丽，功能强大。示例可切换观察水池的视角，不同视角考虑到了光线从不同角度折射和反射的影响，所以波纹效果极其逼真。先介绍下WebGLWebGL是一种3D绘图标准，这种绘图技术标准允许把JavaScript和OpenGL ES 2.0结合在一
2013-10-14 23:11:11
3501
原创 一些纯css3写的公司logo
随着对css3了解得越深入，越来越发现了css3的强大。css3不但能完成一些基本的特效如圆角阴影等，还能借助动画技术实现一些复杂的动画，能替代很多以前js才能完成的工作，css3的作用还不止于此，甚至一些复杂的图片也能通过css3实现，没有做不到，只有想不到。在逛国外的一些前端设计网站时发现一些国外牛人的奇思妙想--用纯粹的css3画的一些公司的Logo,不得不承认国外的技术比国内要先进很多。
2013-10-09 08:33:14
1880
原创 一些纯css3写的公司logo
随着对css3了解得越深入，越来越发现了css3的强大。css3不但能完成一些基本的特效如圆角阴影等，还能借助动画技术实现一些复杂的动画，能替代很多以前js才能完成的工作，css3的作用还不止于此，甚至一些复杂的图片也能通过css3实现，没有做不到，只有想不到。在逛国外的一些前端设计网站时发现一些国外牛人的奇思妙想--用纯粹的css3画的一些公司的Logo,不得不承认...
2013-10-09 08:21:45
176
原创 根据中国气象局提供的API接口实现天气查询
中国气象局提供了三个天气查询的API接口：【1】http://www.weather.com.cn/data/sk/101190101.html【2】http://www.weather.com.cn/data/cityinfo/101190101.html【3】http://m.weather.com.cn/data/101190101.html以json格式返回数据，第一和...
2013-09-24 08:12:19
342
原创 纯CSS3带动画效果导航菜单
随着互联网的发展，网页能表现的东西越来越多。由最开始单纯的文字和链接构成的网页，到后来的表格布局，再到div+css模式，现在发展到了html+css3。网页能表达的东西越来越多，css3兴起已经很多年了，不多由于国内网站要求对IE的兼容，html5+css3的发展很缓慢。html5+css3的出现给前端开发者提供了更多的可能性，以前很多只能通过JS实现的效果用纯粹的css3就能实现了。...
2013-09-24 08:10:06
278
原创 纯css写的仿真图书翻页效果
对css3研究越深入，越觉得惊艳。css3说不上是万能的，但是它能实现的效果也超出了我的想象。它的高效率和动画效果的流畅性很多情况下能替代js的作用。个人习惯css3能实现的效果就不会用js,虽然在国内貌似没有css3的用武之地，这一点完成不能阻挡我对css3的热情。博主是一个地道的开源支持者，在学习css3的过程中写的一些demo会贴出来跟大家分享，都是一些想法最简单的实现，当然会有很多问题...
2013-09-23 11:50:21
612
纯css做的安卓开机动画
随着css3的发展，越来越多的负责绚丽的效果可以由纯css来完成了。用css3实现的动画效果丝毫不必js实现的逊色，而且浏览器对css渲染的速度远比js快，大多数时候css的体积也不js小。其中css3中的动画效果可以实现流畅而强大的动画效果，下面我们来看看css3的能量吧。 下面介绍一个博主完成的纯css3实现的仿安卓开机动画，可爱的安卓机器人。效果图： 下面给大家提供...
2013-09-23 11:48:54
189
如何用css3实现风车效果
前面讲过css3可以替代很多js实现的效果，其实很多时候纯css3甚至可以替代图片，直接用css3就可以画出一些简单的图片。虽然css3画出来的图片效果可能不如直接用图片的好，实现起来也比较复杂，最麻烦的是兼容性问题，不如图片来得直接实用。但是换一种思路去思考问题的解决办法往往能激发我们的灵感，也有助于我们学习css3。下面给出的demo里会有用图片和纯css3实现的风车效果的对比。先看...
2013-09-23 11:35:19
232
原创 纯CSS3带动画效果导航菜单
随着互联网的发展，网页能表现的东西越来越多。由最开始单纯的文字和链接构成的网页，到后来的表格布局，再到div+css模式，现在发展到了html+css3。网页能表达的东西越来越多，css3兴起已经很多年了，不多由于国内网站要求对IE的兼容，html5+css3的发展很缓慢。html5+css3的出现给前端开发者提供了更多的可能性，以前很多只能通过JS实现的效果用纯粹的css3就能实现了。
2013-09-22 17:49:06
2047
原创 纯css写的仿真图书翻页效果
对css3研究越深入，越觉得惊艳。css3说不上是万能的，但是它能实现的效果也超出了我的想象。它的高效率和动画效果的流畅性很多情况下能替代js的作用。个人习惯css3能实现的效果就不会用js,虽然在国内貌似没有css3的用武之地，这一点完成不能阻挡我对css3的热情。博主是一个地道的开源支持者，在学习css3的过程中写的一些demo会贴出来跟大家分享，都是一些想法最简单的实现，当然会有很多问题，希
2013-09-22 17:45:38
3433
原创 纯css做的安卓开机动画
随着css3的发展，越来越多的负责绚丽的效果可以由纯css来完成了。用css3实现的动画效果丝毫不必js实现的逊色，而且浏览器对css渲染的速度远比js快，大多数时候css的体积也不js小。其中css3中的动画效果可以实现流畅而强大的动画效果，下面我们来看看css3的能量吧。下面介绍一个博主完成的纯css3实现的仿安卓开机动画，可爱的安卓机器人。效果图：
2013-09-22 17:43:44
1099
原创 如何用css3实现风车效果
前面讲过css3可以替代很多js实现的效果，其实很多时候纯css3甚至可以替代图片，直接用css3就可以画出一些简单的图片。虽然css3画出来的图片效果可能不如直接用图片的好，实现起来也比较复杂，最麻烦的是兼容性问题，不如图片来得直接实用。但是换一种思路去思考问题的解决办法往往能激发我们的灵感，也有助于我们学习css3。下面给出的demo里会有用图片和纯css3实现的风车效果的对比。
2013-09-22 17:41:16
1551
原创 根据中国气象局提供的API接口实现天气查询
中国气象局提供了三个天气查询的API接口：【1】http://www.weather.com.cn/data/sk/101190101.html【2】http://www.weather.com.cn/data/cityinfo/101190101.html【3】http://m.weather.com.cn/data/101190101.html以json格式返回
2013-09-22 17:38:25
3401
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人