
web
文章平均质量分 64
tomorrow_be_good
这个作者很懒,什么都没留下…
展开
-
jQuery代码分析之一 Animation
jQuery代码分析之一 Animation本文的代码分析基于jQuery 1.7函数jQuery.animate(params,speed, easing, callback)params: 需要被渐变的属性及其目标值这儿需要指出的是jQuery.fx提供了3种特殊的目标属性值:show hide toggle。例如我们可以传入{height: "show"},这样会在hei原创 2012-09-22 11:38:11 · 1169 阅读 · 0 评论 -
实现一个简易的幻灯片(slider)效果
幻灯片是网页中图片展示的一种常用方式,有时候我们还用它来显示当前热点头条等。现在已经有很多插件可以非常方便实现这种效果,例如bxslider,slidesjs.另外还有几篇类似的讲解实现幻灯片效果的文章,例如,Coding a Rotating Image Slideshow w/ CSS3 and jQuery,Slider Gallery with jQuery先上个效果图原创 2012-11-04 22:49:15 · 1537 阅读 · 0 评论 -
使用CSS table来布局
现在已经很少有人会使用table来设计网页的布局,但是table真的过时了吗?不然!例如,在很常见的一个2列的布局中,左边我们想放一个导航菜单,右边放置正文内容,然后顶上放置一个header,页面最下方放置一个footer,这应该是一个很常见的页面布局方式。这个时候,我们希望中间的siderbar跟正文内容都有相同的高度,顶着上面的header与下面的footer,该怎么办呢?带着这个疑问原创 2012-08-29 20:15:57 · 1106 阅读 · 0 评论 -
判定一组矩形是否共同构成一个完整的矩形
function rect(l, t, w, h) { this.l = l; this.t = t; this.w = w; this.h = h;}function check(rects) { var data = []; var i, t, b; for(i = 0; i < rects.length; i++ ) {原创 2015-07-22 11:50:12 · 1019 阅读 · 0 评论 -
模拟撕衣服的代码
<!DOCTYPE html><html> <head> </head> <body><canvas id="c"></canvas> <script>var physics_accuracy = 3, mouse_influence = 20, mouse_cut = 5, gravity = 12转载 2015-07-02 14:51:49 · 882 阅读 · 0 评论 -
我的Javascript的O-O实现
我的Javascript的O-O实现function _class(cls) { var result = function () { !this.hasOwnProperty('upper') && (this.upper = function () { return result.prototype; }); cls原创 2015-06-26 14:32:38 · 647 阅读 · 0 评论 -
也谈JavaScript模块化开发类库的实现
五一看了下sea.js,有些体会所以记录下来。一直以来,谈到web规范,的哦原创 2014-05-04 15:23:55 · 1158 阅读 · 0 评论 -
jQuery代码分析之五Ajax调用
在stackoverflow上看到一个问题,用jQuery.get()跨域(cross domain)访问google api在IE(8,9)中行不通,最后,解决方案是用一个jQuery的ajax扩展,技术要点是应用了IE8,9中特有的XDomainRequest对象,这是它所独有的,不遵循任何当前标准。在后面我们还会提到,IE在做ajax调用时也是有它自己独特的方式。在jQuery文档中关于原创 2013-03-26 20:44:51 · 932 阅读 · 0 评论 -
jQuery代码分析之四Queue
在博文jQuery代码分析之一中偶介绍了下animation的实现机制,怎样实现属性值的渐变?那么如果我们需要在一个元素上做链式animation时,jQuery是如何处理的呢?例如,有如下示范代码:$("#div1").slideDown().fadeOut();这里面涉及到的技术就是偶将在这篇文章中讲到的fn.queue。首先还是看下API定义描述:定义将在匹配元素上执行的一组原创 2012-11-12 23:44:38 · 779 阅读 · 0 评论 -
如何在不用JavaScript的情况下使用CSS来实现图表功能
最近看到smashing magazine举行的一个小设计创意比赛,其中有个获奖作品完全用css来显示图表功能,觉得很amazing。于是,在本地大致剖析了下他的实现原理,果然令人耳目一新啊。注意:下面的代码只在最新的chrome上测试通过。-_-!先上个最后的效果图实现的HTML为原创 2012-07-21 19:47:41 · 743 阅读 · 0 评论 -
jQuery代码分析之三 Event
jQuery代码分析之三 Event本文的代码分析基于jQuery 1.7jQuery事件注册的核心是jQuery.event对象,据类库中的注释介绍,其大部分思想是从Dean Edwards那儿借来的,罗嗦两句,Dean Edwards是个JavaScript大神,很多流行的类库的基本思想从他那儿借来的。例如,让JavaScript能够用更加面向对象的方式组织起来,关于这方面的实践,他算原创 2012-10-17 20:26:36 · 2152 阅读 · 0 评论 -
HTML5设计原理
Jeremy Keith在 Fronteers 2010 上的主题演讲转载自http://www.cn-cuckoo.com/2010/10/21/the-design-of-html5-2151.html今天我想跟大家谈一谈HTML5的设计。主要分两个方面:一方面,当然了,就是HTML5。我可以站在这儿只讲HTML5,但我并不打算这样做,因为如果你想了解HTML5的话,你可以Go转载 2012-11-11 19:08:11 · 2246 阅读 · 1 评论 -
jQuery代码分析之二Selector Engine
jQuery代码分析之二 Selector Engine Sizzle本文的代码分析基于jQuery 1.7Sizzle(selector,context,results,seed)返回值:与selector匹配的元素集selector:CSS selectorcontext:应用CSS selector的HTML元素上下文,默认值为document。比如我们有如下的HTML结原创 2012-10-04 09:58:27 · 1170 阅读 · 1 评论 -
svg画大白
效果图index.html<!DOCTYPE html><html lang="en"><head> <title>untitled</title> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <meta charset="utf-8" /> <meta http-equiv="content-ty原创 2015-08-30 23:20:37 · 835 阅读 · 0 评论