摘要: 最近由于某些原因,导致我不得不把注意力从原来的JS转到CSS上,尽管我现在已经不太想搞CSS了,但现实就是这样不尽人意,没有办法。那今天我就说说我所喜欢的流体布局吧,看到网上很多关于两栏布局中要求一栏固定宽度,另一栏自适应,三栏布局,两侧固定宽度,中间栏自适应的做法都是用到一绝对定位,如: 左侧 ...阅读全文
posted @ 2013-05-01 10:08 zjhsd2007 阅读(2079) 评论(4) 编辑
摘要: 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 *..阅读全文
posted @ 2013-03-29 15:15 zjhsd2007 阅读(13258) 评论(16) 编辑
摘要: 这是帮一个群里的朋友写的,基于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||{}阅读全文
posted @ 2013-03-04 15:29 zjhsd2007 阅读(457) 评论(2) 编辑
摘要: 核心思路参考了群里的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阅读全文
posted @ 2013-02-22 13:35 zjhsd2007 阅读(3941) 评论(3) 编辑
摘要: 这是前段时间没事做的时候做的,今天整理文件夹的时候翻出来了,那就发上来吧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阅读全文
posted @ 2013-02-22 13:24 zjhsd2007 阅读(3614) 评论(6) 编辑
摘要: 以前项目上用的那个虽然也是自己写的,但是是基于JQ的,前不久看到人人网出的JS有道考题和这个很像,所以就用原生JS重写了一遍:JS(function(win){ var tips = { 'title':'信物宝提示', 'enter':'确定', 'cancel':'取消', 'close':'关闭' }, isIE6 = !window.XMLHttpRequest, cssLoaded = false, isOpen = false, loadCss = fun阅读全文
posted @ 2013-02-05 14:39 zjhsd2007 阅读(853) 评论(0) 编辑
摘要: 这个是蛮久以前的东西了,当一个页面有太多内容的时候,我们可以把第一屏以外的内容放到一个textarea里面,让textarea隐藏,这样一开始内容是不会加载的,同时页面就会更快的呈现给用户,当用户在浏览第一屏的内容的时候,我们可以再用JS让浏览器加载textarea里面的内容,或者当用户把滚动条拖到下面的时候再加载,那么这里就需要一个加载HTML代码片断的函数,//加载HTML代码片断function loadHtmlSnippet(source,target,callback){ var iframe = document.createElement('iframe'),do阅读全文
posted @ 2013-01-11 16:02 zjhsd2007 阅读(139) 评论(0) 编辑
摘要: 纯属娱乐,稍微修改一下,可以改成类似一个模板引擎的东西。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阅读全文
posted @ 2013-01-09 08:58 zjhsd2007 阅读(685) 评论(4) 编辑
摘要: 最近在很多地方很现这种效果,所以就写了个。说明:每个单独的移动的对象用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.阅读全文
posted @ 2012-10-26 16:37 zjhsd2007 阅读(444) 评论(3) 编辑
摘要: 最近运营部的同事给我们提出一个需求--想实现一个自动保存表单内容的功能,因为我们网站的表单页比较多,而且每页面要填的内容也比较多,像那些发布产品,发布需求页面要填 的字段比较多,有时候他们电脑突然出问题了,或者不小心把浏览器关了或者...,总之是一些乱七八糟的因素导致页面没有填完就被强行关闭了,那以前辛辛苦苦填的东西就都没有了,所以就有了这个需求。如是就有了下面这段代码:JS:(function(){ var events = {}; var autoSave = function(opts){ return new autoSave.prototype.init(opts) }; auto.阅读全文
posted @ 2012-08-31 14:07 zjhsd2007 阅读(1515) 评论(1) 编辑