随笔分类 - javascript
javascript
摘要:Zepto是一个轻量级的针对现代高级浏览器的JavaScript库,它与jquery有着类似的api。 如果你会用jquery,那么你也会用zepto。这段时间公司的事情比较少,所以就把它的源码看了下,觉得写的挺好的,所以就有了给它写注释的想法。当然,这里面的注释只是我读代码时对它的理解,并不一定正确,如果有错误还请指正,先谢谢了。另外,敬请期待另一个JS大牛(果果)的JS库(then.js)的源码注释。 1 /* Zepto v1.0-1-ga3cab6c - polyfill zepto detect event ajax form fx - zeptojs.com/license *..
阅读全文
摘要:这是帮一个群里的朋友写的,基于JQuery的。可以先去http://www.apple.com.cn/mac/看下具体效果,记得用chrome看,它这个貌似是用CSS3做的,IE下就是简单的作透明切换的。JS:(function($){ $.fn.appleShow = function(opts){ var set = $.extend({ itemsClass:'', conctrolClass:'', arrowClass:'', auto:false, timer:3000, type:'click' },opts||{}
阅读全文
摘要:核心思路参考了群里的MK桑的,在此谢过。(function(){ var db = document.body; var Calendar = function(opts){ return new Calendar.prototype.init(opts); }; Calendar.prototype = { constructor:Calendar, init:function(opts){ this.opts = extend({ target:'', initial:'2012/09/27', format:'YYYY-MM-DD', ca
阅读全文
摘要:这是前段时间没事做的时候做的,今天整理文件夹的时候翻出来了,那就发上来吧JS(function(win){ var doc = win.document,db = doc.body; var mousewheel = 'onmousewheel' in document ? 'mousewheel' : 'DOMMouseScroll'; var skyScroll = function(opts){ return new skyScroll.prototype.init(opts);}; skyScroll.prototype = { cons
阅读全文
摘要:以前项目上用的那个虽然也是自己写的,但是是基于JQ的,前不久看到人人网出的JS有道考题和这个很像,所以就用原生JS重写了一遍:JS(function(win){ var tips = { 'title':'信物宝提示', 'enter':'确定', 'cancel':'取消', 'close':'关闭' }, isIE6 = !window.XMLHttpRequest, cssLoaded = false, isOpen = false, loadCss = fun
阅读全文
摘要:这个是蛮久以前的东西了,当一个页面有太多内容的时候,我们可以把第一屏以外的内容放到一个textarea里面,让textarea隐藏,这样一开始内容是不会加载的,同时页面就会更快的呈现给用户,当用户在浏览第一屏的内容的时候,我们可以再用JS让浏览器加载textarea里面的内容,或者当用户把滚动条拖到下面的时候再加载,那么这里就需要一个加载HTML代码片断的函数,//加载HTML代码片断function loadHtmlSnippet(source,target,callback){ var iframe = document.createElement('iframe'),do
阅读全文
摘要:纯属娱乐,稍微修改一下,可以改成类似一个模板引擎的东西。var strToHtml = (function(){ var boundaryReg = /[+>]/,relationReg = /[+>]/g,classReg = /\.(\w+)/,idReg=/#(\w+)/,repeatReg=/\*(\d+)/,typeReg=/\:(\w+)/,tagReg = /^\w+/; var h,r; function expand(str){ var node = document.createElement(str.match(tagReg)[0]),c,frag = doc
阅读全文
摘要:最近在很多地方很现这种效果,所以就写了个。说明:每个单独的移动的对象用add添加进去,个数不限,参数target就是对象的ID,dir表示方向,支持top,bottom,left,right,注意top不要和bottom同时存在,left和right也是,rangX表示是允许左右移动的范围,rangeY表示的是上下移动的范围,注意方向与 rangeX或rangeY要对应,不能方向是 top或者bottom,但范围却是rangeX,这样肯定是不行的,不带这么坑爹的。JS:(function(){ var parallaxScrolling = function(opts){ return ne.
阅读全文
摘要:最近运营部的同事给我们提出一个需求--想实现一个自动保存表单内容的功能,因为我们网站的表单页比较多,而且每页面要填的内容也比较多,像那些发布产品,发布需求页面要填 的字段比较多,有时候他们电脑突然出问题了,或者不小心把浏览器关了或者...,总之是一些乱七八糟的因素导致页面没有填完就被强行关闭了,那以前辛辛苦苦填的东西就都没有了,所以就有了这个需求。如是就有了下面这段代码:JS:(function(){ var events = {}; var autoSave = function(opts){ return new autoSave.prototype.init(opts) }; auto.
阅读全文
摘要:写了个拖拽上传的效果。说明:默认情况下的事件对象是body,就是可以直接将图片拖到浏览器窗口上,事件对象也可以是其它HTML元素,只需将该元素的ID赋给target就行了,另外 也可以是文件域(将下面的HTML代码里的注释去掉就可以查看效果)效果图:HTML: 1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="utf-8" /> 5 <link rel="stylesheet" type="tex
阅读全文
摘要:在群里出的一个题:任意一串数字,取3位或以上的连续递增的数字。比如‘123964664567891224644567646789’,结果应该是123,456789,4567,6789我的比较二的方法:var get = (function(re){ return function(str,n){ var arr = str.split(''),len=arr.length,p,k=0; if(arr.length < n) return re; while(len-1 >= n+k){ //取前面三个数 p = arr.slice(k,n+k); ...
阅读全文
摘要:今天完成了一个表单验证的功能,原生JS写的。同样挂在朋友的空间里。地址:http://www.webzhishi.com/javascript-form/说明一下:三个接口 1)添加验证项 var a = validator({ "form": "validator-form", ajaxSubmit:true, beforSubmit:function(){ //alert("表单提交前执行的函数"); }, afterSubmit:function(){ alert("ajax提交后返回的数据是:"+this.
阅读全文
摘要:上个星期在檬牛和果牛的帮助下,写了个百叶窗效果,由于 blog没法预览,所以把文件放在一个朋友的空间里,地址:http://www.webzhishi.com/baiyechuang2/,想要源码的和我说声吧。
阅读全文
摘要:最近写了不少别人写过的东西,哎。HTMLView Code <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content
阅读全文
摘要:最近发现这种布局蛮流行的,所以就自己动手写了一个。HTMLView Code <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"><html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>Untitled Doc
阅读全文
摘要:为一群友写的。HTMLView Code 1 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> 2 <html> 3 <head> 4 <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> 5 <title>Untitled Document&l
阅读全文
摘要:用到了我自己的库里几个函数(sbi.array.each,sbi.dom.ready,sbi.event.addEvent,sbi.ani.animate)这些都是最基本的封装函数了,所以就不放上来了。先看效果图:这是默认效果这里鼠标移到其中一项时的效果代码:<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="ht
阅读全文
摘要:ajax高级程序设计上的。/* * 将ajax根据优先级进行排列的方法 * 构造一个简单的排列函数,接受一个排序的函数 * 所有添加的ajax保存到_items中 * */function PriorityQueue(fn){ this._items = []; if(typeof fn == 'function'){ this._compare = fn; }}PriorityQueue.prototype = { constructor:PriorityQueue, _compare:function(oValue1,oVlaue2){ if(oValue1<oVla
阅读全文
摘要:在网上看到的,收藏一下:// ----------------------------------------------------------// A short snippet for detecting versions of IE in JavaScript// without resorting to user-agent sniffing// ----------------------------------------------------------// If you're not in IE (or IE version is less than 5) then
阅读全文
摘要:function createNamespace(name){ var domains = name.split('.'); var cur_domain = window; for(var i=0,len=domains.length;i<len;i++){ var domain = domains[i]; if(typeof cur_domain[domain] == 'undefined'){ cur_domain[domain] = {}; } cur_domain = cur_domain[domain] } return cur_domain;
阅读全文