随笔分类 -  JavaScript耕耘中

摘要:1、border-radius有bug,围不住background描述:设置了border-radius后,背景色依然会从圆角里冒出来解决方法:在设置了border-radius的容器加上background-clip:padding-box;一定要把background样式提到background... 阅读全文
posted @ 2014-10-10 18:47 hotcho 阅读(607) 评论(0) 推荐(0)
摘要:grunt是一个开源的基于任务 (Task) 的前端构建框架。它除了有 Jake 的优点(跨平台、开发简单)以外,还有一套设计良好的 task 框架用来组织各种构建任务。grunt 内置了几个非常常见的构建任务:concat - 组合各种文件lint - 用 JSHint 检查代码min - 用 UglifyJS 压缩代码qunit - 跑 QUnit 单元测试watch - 当源代码文件发生变化时自动执行任务除此之外还可以通过 npm 来方便的获取几百个现成的 task,比如用 closure 而不是 UglifyJS 来压缩 js,或者用 less 来生成 css,又或者用 jslint 阅读全文
posted @ 2013-03-05 17:20 hotcho 阅读(454) 评论(0) 推荐(0)
摘要:文转图是比较常见的web应用。特别在微博里,由于限制了字数,所以网上出现了不少把一段文字转为图片的方法,主要有以下几种:实现难度文本格式数据量服务器压力兼容性Flash方法低丰富高小一般HTML5方法低简单高小一般后台方法一般丰富低大好优缺点从上图可见一斑。flash和后台实现的文转图的方案比较常见,而且配合html富文本编辑器还可以实现丰富的文本格式。由于是图片数据是前端生成,所以flash和html5的方法发送的数据量会大点,但是服务器的压力相应会减少。html5 canvas由于只适合高端浏览器,所以不支持canvas的还得降级用flash支持。下面讨论用html5+flash实现常见的 阅读全文
posted @ 2012-12-18 19:38 hotcho 阅读(1927) 评论(0) 推荐(0)
摘要:之前新项目用flash上传图片数据以及其他一些字段,由于之前的开源库不够好,所以自己重写了一个AS3form http request builder。view more at:https://github.com/cos2004/FormRequestBuilder 用途:用于flash同时发送图片数据和一些其他值对的时候,此小工具可以方便构造一个标准的http form请求。 顺便讲一点http的知识: Content-Type: multipart/form-data; boundary=Rm9ybVJlcXVlc3RCdWlsZGVyQnljb3MyMDA0 头部的boun... 阅读全文
posted @ 2012-12-03 11:39 hotcho 阅读(3937) 评论(0) 推荐(0)
摘要:晚上看网页的时候有时候会感觉很亮,所以特意做了一个转换到’夜间模式‘浏览的js书签,一般能使大部分网页的背景转为黑色。特别适合喜欢黑底白字浏览的程序猿们~用法:把下面的链接拖到浏览器的书签栏,或右键添加到书签,需要用的时候点一下即可。夜间模式功能:支持chrome,firefox,ieq键:减少字体亮度w键:增加字体亮度要恢复刷新页面即可==================================================作者:绿色花园出处:http://www.cnblogs.com/cos2004/archive/2012/08/28/2660429.html======.. 阅读全文
posted @ 2012-08-28 18:27 hotcho 阅读(2845) 评论(2) 推荐(0)
摘要:前几天看了一个豆瓣年会的代码大爆炸视频,即用code swarm生成的一个可视化代码贡献量视频动画,挺赞的。code swarm支持使用svn、cvs等代码管理工具提交的日志生成动画。年尾手头工作不多,花了一点时间自己也搞了一下自己再公司做的项目的codeswarm,可惜svn只有部分的提交日志,否则生成的视频会更帅。跟大家说一下svn日志版生成codeswarm动画的步骤:前期准备:1、python 2.5环境、java环境并配置好2、服务器生成的svn log日志文件生成动画:1、去http://codeswarm.googlecode.com/svn/trunk 下载最新的codes.. 阅读全文
posted @ 2012-01-18 18:27 hotcho 阅读(1494) 评论(0) 推荐(0)
摘要:1. 技术背景 FaceBook页面加载技术试想这样一个场景,一个经常访问的网站,每次打开它的页面都要要花费6 秒;同时另外一个网站提供了相似的服务,但响应时间只需3 秒,那么你会如何选择呢?数据表明,如果用户打开一个网站,等待3~4 秒还没有任何反应,他们会变得急躁,焦虑,抱怨,甚至关闭网页并且不再访问,这是非常糟糕的情况。所以,网页加载的速度十分重要,尤其对于拥有遍布全球的5亿用户的Facebook(全球最大的社交服务网站)这样的大型网站,有着大量并发请求、海量数据等客观情况,速度就成了必须攻克的难题之一。2010 年初的时候,Facebook 的前端性能研究小组开始了他们的优化项目,经过 阅读全文
posted @ 2011-09-09 18:53 hotcho 阅读(2333) 评论(2) 推荐(1)
摘要:在AJAX应用中经常需要根据用户的动作实时加载数据,加载速度与具体的网络情况有关。在加载过程中,如果你想告诉用户有信息正在加载,你可能需要一个“Loading”的动画图标。然而,并非所有人都有能力去设计和制作出这样的图标。在这里,我向大家推荐几个在线工具,它们可以根据设置生成“Loading”动画图标。PreLoaders.NetPreLoaders.Net提供的动画样式非常全面,有2D的、也有3D的,还可以设置背景色、前景色、大小、动画速度等参数。AjaxLoad.InfoAjaxLoad.Info目前还是beta版,仅能设置动画样式、前景色和背景色。LoadInfo.NetLoadingI 阅读全文
posted @ 2011-05-29 11:01 hotcho 阅读(491) 评论(0) 推荐(0)
摘要:一、界面和用户体验(Interface and User Experience)1.1知道各大浏览器执行Web标准的情况,保证你的站点在主要浏览器上都能正常运行。你至少要测试以下引擎:Gecko (用于Firefox )、Webkit(用于Safari 、Chrome 和一些手机浏览器)、IE(你可以利用微软发布的Application Compatibility VPC Images 进行测试)和Opera 。同时,不同的操作系统,可能也会影响浏览器如何呈现 你的网站。1.2除了浏览器,网站还有其他使用方式:手机、屏幕朗读器、搜索引擎等等。你应该知道在这些情况下,你的网站的运行状况。Mobi 阅读全文
posted @ 2011-05-09 09:51 hotcho 阅读(380) 评论(1) 推荐(0)
摘要:图是自己作的,但是没什么原创内容,参考自《JavaScript高级程序设计》一书的插图。基本不用文字介绍,直接看图理解这些概念更加明了。图1:鼠标事件相关的坐标图示。点此查看大图图2:页面元素的坐标等属性。点此查看大图参考资料:《JavaScript高级程序设计》 阅读全文
posted @ 2011-03-26 00:16 hotcho 阅读(352) 评论(0) 推荐(0)
摘要:学习JS也有一段时间了,这是我花了近一天的时间做的练习,不会的函数就翻翻jQuery的帮助文档,还算做的比较顺利。兼容ie6(有一点点兼容性问题但不影响功能)、7、8和ff,还有一个小问题,就是ie8好像不支持jQuery的fadeIn()方法,因此ie8下没有渐变的切换效果,不知什么原因。效果预览(预览有问题请把代码拷回本地html预览): 这是题目1234代码:<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xh 阅读全文
posted @ 2011-03-10 11:51 hotcho 阅读(1891) 评论(1) 推荐(2)
摘要:作为一个开发者和作家,我的一部分工作就是跟随web世界最新发展潮流——不管是关于公司合并、在线购物潮流、或者是编程技巧。我承认如今很难跟上 业界里发生的所有事情,但是有个四处流传的小道消息却吸引了许多的目光:JavaScript2.0提案。作为新的JavaScript2.0\EMCAScript 4.0计划于2009年终稿,但是日前已经做了很多的工作-包括好的、不好的。今天... 阅读全文
posted @ 2010-11-19 02:19 hotcho 阅读(215) 评论(0) 推荐(0)
摘要:博客园专题介绍:http://book.cnblogs.com/zt/wtjs/博客园购买网址:http://www.hjbook.net/product/3411/网络书店购买网址:http://www.china-pub.com/301666亲笔签名书专门店:http://shop36954457.taobao.com/引子  编程世界里只存在两种基本元素,一个是数据,一个是代码。编程世界就是... 阅读全文
posted @ 2010-11-07 14:59 hotcho 阅读(331) 评论(0) 推荐(0)