chemdemo - 博客园

2011年4月

MooTools1.3.1 API（Core）学习及试译（四）——Browser

摘要：写在前面：由于自身英语水平有限，所以翻译不敢保证能让所有人都理解，如果您在阅读中发现什么疑问，请务必及时查看官方API，以免误导。另外，有部分是未经翻译的，一方面是因为找不到合适的中文描述之，还有就是有的地方看英文更易懂~续前面三篇，本篇关于Browser对象：提供一些检测浏览器版本、运行平台的方法//Object: Browser//附加到Browser对象上的一些浏览器属性以检测浏览器及运行平台//Browser.FeaturesBrowser.Features.xpath - (boolean) 如果浏览器支持通过XPath查询DOM时返回trueBrowser.Features.air 阅读全文

posted @ 2011-04-05 23:46 chemdemo 阅读(332) 评论(0) 推荐(0) 编辑

MooTools1.3.1 API（Core）学习及试译（三）——Types（二）

摘要：写在前面：由于自身英语水平有限，所以翻译不敢保证能让所有人都理解，如果您在阅读中发现什么疑问，请务必及时查看官方API，以免误导。另外，有部分是未经翻译的，一方面是因为找不到合适的中文描述之，还有就是有的地方看英文更易懂~续上一篇MooTools1.3.1 API（Core）学习及试译（一）——Types（一）这一篇继续Types，包含Number、Function、Object、Event归纳一下Number、Function、Object、Event方法如下：NumberNumber.from：把传入的参数转换为数值，返回null或数值Number.random：返回一个介于传入参数之间的阅读全文

posted @ 2011-04-05 23:34 chemdemo 阅读(426) 评论(0) 推荐(0) 编辑

MooTools1.3.1 API（Core）学习及试译（二）——Types（一）

摘要：写在前面：由于自身英语水平有限，所以翻译不敢保证能让所有人都理解，如果您在阅读中发现什么疑问，请务必及时查看官方API，以免误导。另外，有部分是未经翻译的，一方面是因为找不到合适的中文描述之，还有就是有的地方看英文更易懂~这一篇是Types第一篇——Array、String，即MooTools1.3.1里对js原生类型的扩展归纳以下，Array、String方法如下：ArrayArray.each：用于循环遍历数组或伪数组（如getElementsByTagName返回的结果或arguments）Array.clone：返回传入数组的一个副本Array.from：转换传入的（已经定义过且不是数阅读全文

posted @ 2011-04-05 22:20 chemdemo 阅读(441) 评论(0) 推荐(0) 编辑

MooTools1.3.1 API（Core）学习及试译（一）——Core

摘要：写在前面：由于自身英语水平有限，所以翻译不敢保证能让所有人都理解，如果您在阅读中发现什么疑问，请务必及时查看官方API，以免误导。另外，有部分是未经翻译的，一方面是因为找不到合适的中文描述之，还有就是有的地方看英文更易懂~这是MooTools1.3.1API（Core）第一部分——Core，是MooTools中使用的各类方法//Type: Core//包括MooTools中使用的各类方法Function: typeOf返回一个对象的类型语法：typeOf(obj);参数obj - (object) 内嵌的对象返回：'element' - (string) 如果是DOM的元素节点阅读全文

posted @ 2011-04-05 21:42 chemdemo 阅读(699) 评论(0) 推荐(0) 编辑

2011年3月

js实现数字时钟

摘要：看过别人的思路，自己也写了一个。原理就是准备10张图，图片名分别和图上的数字对应，时间的格式是xx:xx:xx，分别有六个位置的图片需要动态修改crs属性，每个位置上的数字是n（具体由当前时间决定），这个位置上的图片即为n.gif，就这样。请先查看Demo然后是结构：View Code 1 <p> 2 当前时间为： 3 <span id="clock"> 4 <img class="num" src="images/0.gif" /> 5 <img class="num" 阅读全文

posted @ 2011-03-10 23:48 chemdemo 阅读(1960) 评论(0) 推荐(0) 编辑

模拟windows平台的上下文菜单

摘要：技术上没什么难的，就是定义一个隐藏的box，当触发上下文事件时显示它，当单击body任意处时又隐藏它。样式效果比较粗糙，请见谅~~~Demo在这里结构：View Code 1 <div id="wrap"> 2 <ul id="menu"> 3 <li><a href="">撤销</a></li> 4 <li><a href="">重做</a></li> 5 <li><a hre 阅读全文

posted @ 2011-03-10 23:01 chemdemo 阅读(333) 评论(0) 推荐(0) 编辑

js实现google网站的小眼睛

摘要：没看之前，觉得会挺难的，今天看了别人的思路，于是自己摸索着也整了一个出来。感觉这东西也不太实用，不过把它挂在博客上什么的装饰一下还可以，但主要是练习js，提高自己的编程能力啦~。写的时候，画张图，边分析边写，会容易些，另外就是一些初中数学知识的运用啦......请先查看Demo源码部分：html：<div id="googleEye"> <h1>Google eye!</h1> <div id="leftEye"><img src="images/pupil.gif" />& 阅读全文

posted @ 2011-03-08 23:54 chemdemo 阅读(806) 评论(0) 推荐(4) 编辑

一个简单的tab选项卡实例

摘要：结构：View Code 1 <div class="demo"> 2 <ul id="tab_t1" class="hd"> 3 <li>新闻</li> 4 <li>视频</li> 5 <li>图片</li> 6 </ul> 7 <ul id="tab_c1" class="bd"> 8 <li class="news"> 9 我正要推开车门，阅读全文

posted @ 2011-03-07 20:30 chemdemo 阅读(634) 评论(0) 推荐(0) 编辑

js实现淘宝首页图片轮播效果(修正图片滚动顺序的问题)

摘要： 3月6日修改：感谢园友“猪如此累”和“平平”的建议，现已修正图片滚到最后一张时跳到第一张的问题，改为滚到第5张时倒序返回。谢谢大家的意见，今晚改的时候有不少收获~~~！以前写js的时候，可能所需的功能也比较简单，所以一直使用常规方法（面向过程），有的时候写到后面都不知道自己都写了写什么，虽然有时候效果能勉强实现，可是一看code就惨不忍睹。今天算是真正领教到了OPP的强大，代码易读、可移植性强......等等特点，可就是在实现的过程中那叫一个痛苦（至少偶现在的水平来说是的），真正写code没用多少时间，大部分的时间都在想，这让我联想到了前几天投简历面试时面试官和我说的那样，他当时就说写js重阅读全文

posted @ 2011-03-04 19:36 chemdemo 阅读(9917) 评论(18) 推荐(10) 编辑

对闭包的理解

摘要：从网上看了一些关于js闭包的文章，现在总算是明白之前遇到过的一系列问题，比如：function a() { var nodes = [1,2,3,4,5]; var arr = []; for(var i=0; i<nodes.length; i++) { return function() { arr[i] = i; } } return arr;}var b = a();alert(b);比如这段看似没什么语法问题的代码，为啥返回结果会让人如此的蛋疼呢？我想如果不理解或不知道闭包的话，这个问题还真回答不了，其中闭包涉及到了关于执行环境、作用域链等js中比较难理解且又很重要的概念，关于阅读全文

posted @ 2011-03-04 17:38 chemdemo 阅读(328) 评论(0) 推荐(0) 编辑

firebug在js调试中的log功能列举

摘要：凡是写js或者进行前端开发的人员对firebug都不陌生，firebug在js的调试中功不可没。总的说来，用firebug调试js包括以下几个部分：1、检查常规错误：这个就是运行js之后，如果有错误的话在ff（或者在使用firebug lite的其他浏览器）右下角就会有相应的提示，最常见的就是一个表示错误的“X”图标，具体就不赘述的，大家都懂；2、完善的log功能：就是创建了一个console的对象（window.console），它有一些强大的方法帮助我们调试js，详细见下文；3、控制台的命令行功能：打开firebug的“控制台”面板，在最低端“>>>”符号之后即可输入相应阅读全文

posted @ 2011-03-01 23:48 chemdemo 阅读(1324) 评论(0) 推荐(2) 编辑

2011年2月

JS文字滚动效果

摘要：没什么技术难度，主要是Array对象的push()和shift()方法的调用。一般的实现方法，即直接分别在id为start和stop的button上添加onclick事件，然后执行相应的函数：html：<div id="test">这里是滚动的文字！</div><p class="btns"><button type="button" id="start">开始</button><button type="button" id=& 阅读全文

posted @ 2011-02-28 00:02 chemdemo 阅读(2302) 评论(0) 推荐(0) 编辑

《JavaScript高级程序设计2》学习笔记——DOM2和DOM3（二）

摘要： View Code //元素大小var box = document.getElementById("box");alert(box.offsetLeft);//58function getElementLeft(element) {//求element元素在页面上的左偏移量，top相似 var actualLeft = element.offsetLeft; var current = element.offsetParent;//offsetParent属性不一定与parentNode相等，如td的offsetParent为作为其祖先元素的table while(cur 阅读全文

posted @ 2011-02-26 17:02 chemdemo 阅读(300) 评论(0) 推荐(0) 编辑

《JavaScript高级程序设计2》学习笔记——DOM2和DOM3（一）

摘要： View Code //-----------------DOM2 node-----------------//对html元素来说，localName为html，tagName是html，nameSpaceURI是http://www.w3.org/1999/xhtml，prefix是null//对svg来说，localName为svg，tagName是s:svg，nameSpaceURI是http://www.w3.org/2000/svg，prefix是svar svg = document.getElementsByTagName("s:svg");alert(do 阅读全文

posted @ 2011-02-26 17:01 chemdemo 阅读(496) 评论(0) 推荐(0) 编辑

《JavaScript高级程序设计2》学习笔记——BOM

摘要： View Code var leftPos = (typeof window.screenLeft == "number") ? window.screenLeft : window.screenX;var topPos = (typeof window.screenTop == "number") ? window.screenTop : window.screenY;//alert(leftPos + "," + topPos);//alert(top.screenX);window.moveTo(0, 0);window.mov 阅读全文

posted @ 2011-02-26 16:52 chemdemo 阅读(246) 评论(0) 推荐(0) 编辑

《JavaScript高级程序设计2》学习笔记——匿名函数

摘要： View Code function createComparisionFunction(prototypeName) { return function(object1, object2) { var value1 = object1[prototypeName]; var value2 = object2[prototypeName]; if(value1 < value2) { return -1; } else if(value1 > value2) { return 1; } else { return 0; } }}function createFunctions() 阅读全文

posted @ 2011-02-26 16:51 chemdemo 阅读(190) 评论(0) 推荐(0) 编辑

《JavaScript高级程序设计2》学习笔记——引用类型

摘要： View Code //Object类型 //new操作符创建Object实例var person = new Object();person.name = 'chemdemo';person.age = 23; //对象字面量创建对象var person = { name : "chemdemo", age : 23};var person = { "name" : 'chemdemo', 'age' : 23};var person = {};person.name = 'chemdemo 阅读全文

posted @ 2011-02-26 16:48 chemdemo 阅读(238) 评论(0) 推荐(0) 编辑

《JavaScript高级程序设计2》学习笔记——Ajax与JSON

摘要： View Code //XHR对象的创建//适用于IE7之前的版本function createIeXHR() { if(typeof arguments.callee.activeXString != 'string') { var versions = ['MSXML2.XMLHttp.6.0', 'MSXML2.XMLHttp.3.0', 'MSXML.XMLHttp']; for(var i=0, len=versons.length; i<len; i++) { try { var xhr = new Active 阅读全文

posted @ 2011-02-26 16:36 chemdemo 阅读(337) 评论(0) 推荐(0) 编辑

2010年12月

【转】字符引用和空白字符

摘要：出处：http://lifesinger.org/blog/2010/01/charater-references/字符引用在 html 中，有三种字符引用方式（参考 HTML5 规范）：1、Named character references, 通过名称来引用。在 HTML 4.01 中称之为 Character entity references（字符实体引用）比如 < > ", 这里有一份详细列表 named-character-references。2、Decimal numeric character reference, 通过十进制数值来引用。比阅读全文

posted @ 2010-12-10 10:56 chemdemo 阅读(5244) 评论(0) 推荐(0) 编辑

2010年11月

大小不定的图片垂直居中汇总

摘要：最近一段时间一直学习js，CSS接触不多，前几天在蓝色理想经典论坛上看到一篇帖子（CSS图片垂直居中方法整理集合），按照上面的做法做了一些改进和扩展，分享如下：针对一个box里面的n张图片，我总结了下面几种方法（持续更新）使其在box里面垂直居中（水平居中就不废话了，你懂的~）。1、使line-height值和box的height值相同结构如下（下面第6点的结构也一样，除了box的扩展类名不同）：... 阅读全文

posted @ 2010-11-26 19:34 chemdemo 阅读(4253) 评论(4) 推荐(0) 编辑

公告