摘要： 最近在读阿当的《Web前端开发修炼之道》, 其中有不少东西值得前端路上的朋友学习. 结合自己日常编码的一些经验, 我将陆陆续续将一些从书中学到的以及自己总结的一些前端方面的技巧分享给大家.Html语义化, 似乎是一个老生常谈的问题. Google一下,也有大把关于语义化的文章. 为什么要语义化标签? 我是这样认为的:Html的每个标签都有它特定的意义,而语义化,就是让我们在适当的位置用适当的标签, 以更好的让人和机器(机器可理解为浏览器可理解为搜索引擎)都一目了然. 如果我的解释不够明了, 请Google. 如何在合适的位置使用合适的标签? 这是一个简单的理解逻辑. 比如, h1~h6标签是 阅读全文

摘要： 腾讯新闻详情页有一个事件进展效果, 觉得挺有意思. 于是, 就有了本文的效果: 按数据源均分时间点幻灯. 花了三个多小时写的, 当然, 包括样式与调试. 兼容主流, 建议在Chrom,Firefox,Opera,Safari等标准浏览器中查看. Ie下没有阴影及圆角.实现了根据源数据(样例中是一个JSON数据组)总条数, 均分出时间点以平滑向右动画方式显示在时间线上, 当鼠标划过时间点时, 显示对应的日期及标题. 鼠标划过事件, 充分考虑了用户体验,当用户快速(无意识移动)从时间点上划过时, 并不触发相应事件.相关的方法说明及使用, 请参见下面的注释或发评论, 同时也欢迎大家找bug并提交.J 阅读全文

摘要： 实际应用中, 获取元素样式在实际应用中一定常用到, 若是纯粹html中, 直接elem.style.attr就可获取, 但更多的时候我们是要从Css中获取元素的最终样式属性.所以, 我们得利用IE的currentStyle和W3C的getPropertyValue获取.elem.style.attr获取样式的方法就不说了. 先来看currentStyle方法, 此对象ie专属, 代表了在全局样式表、内嵌样式和 HTML 标签属性中指定的对象格式和样式. IE下通过它, 就可以获取元素的Css属性值.而针对其他标准浏览器, W3C也提供了一个方法getPropertyValue, 此方法, 稍有 阅读全文

摘要： 用纯CSS实现的列表背景色交替效果, 另外附加了个鼠标划过变色. 其实, 这是08年写的一个效果, 当时博客还叫Bluebird’s sky, 哈, 如今仅剩个本地的躯壳了, 域名都过期了.列表背景色交替实现原理很简单,用一张二倍于列表单行高度的背景图,然后,上半部分PS成奇数行颜色,下半部分PS成偶数行颜色,然后将这张图定义给列表外围元素平铺.这样一来,纵使有万千行,它也会轻而易举的交替颜色.相之于JS实现,它只有寥寥几行代码,是不是轻了许多,但有一点, 背景图必须算好, 列表高度值也必须固定, 否则就悲剧了.鼠标划过效果,不多言了, 定义元素的:hover. 悲剧的是, 万恶的是IE6不支 阅读全文

摘要： 日常项目中, 对于列表类文章或数据, 大概都会用到checkbox的全选或全不选的功能, 以前的项目中也写过checkbox的选择js, 但都没有整理过. 正好前几天一个兄弟遇到了这个问题, 索性, 我花了点时间, 用原生JS与jQuery分别写了一个版本, 考虑到使用时灵活性问题, 未封装, 需要的童鞋使用时自行改下相关参数.功能介绍点此查看DEMO1. 全选/全不选 选框一体实现, 即列表中选框的状态与全选/全不选框前的选框状态一致;2. 自动更改 全选/全不选 选框的状态, 即列表中选框都选中时, 全选/全不选 选框也选中, 反之亦然;3. 列表行内点击也可选中行内的checkbox, 阅读全文

摘要： 计时器setTimeout()与setInterval()是原生JS很重要且用处很多的两个方法, 但很多人一直误以为是相同的功能: 间隔时间重复执行传入的句柄函数. 但实际上, 并非如此, 既然JS给出了两个不同的命名, 肯定有其迥异之处.先来看看两者JS手册及英文词典上的解释:JS手册»setTimeout() : 用于在指定的毫秒数后调用函数或计算表达式;英文释义»timeout() : 超时；暂时休息；工间休息;JS手册»setInterval() : 按照指定的周期(以毫秒计)来调用函数或计算表达式. 会不停地调用函数,直到 clearInterval() 被调用或窗口被关闭;英文释义 阅读全文

摘要： jQuery核心中, 有一组队列控制方法, 这组方法由queue()/dequeue()/clearQueue()三个方法组成, 它对需要连续按序执行的函数的控制可以说是简明自如, 主要应用于animate ()方法, ajax以及其他要按时间顺序执行的事件中.先解释一下这组方法各自的含义.queue(name,[callback]): 当只传入一个参数时, 它返回并指向第一个匹配元素的队列(将... 阅读全文

摘要： jQuery的数组处理,便捷,功能齐全. 最近的项目中用到的比较多,深感实用,一步到位的封装了很多原生js数组不能企及的功能. 最近时间紧迫,今天抽了些时间回过头来看 jQuery中文文档 中对数组的介绍,顺便对jQuery数组做个总结.温故,知新.强烈建议你打开DEMO演示后再看下面的详解: 点此查看DEMO1. $.each(array, [callback]) 遍历[常用]解释: 不同于例遍... 阅读全文

摘要： 选择标签至表单域插件, 基于jQuery, 可多选/可过滤重复/可限制个数. 是以前的项目中用到过的一个项目, 当初是用原生js东拼西凑的, 用jQuery重写了下,已封装成插件.暂时没有对手动输入的做判断, 需要的话, 可自行在keyup及change事件中添加相关判断.相关说明及调用方法,请参见代码中的注释.演示及代码:点此查看DEMO;(function(){ $.fn.extend({ i... 阅读全文

摘要： 通过dl模拟实现SELECT下拉列表. 其实这是项目中要常用到的一个效果, 于是, 在之前写的基础上封装成了一个插件. 可自定义样式, 可防止用户本意划过时触发事件.具体思路就不说了,比较常规, 代码中也有注释. 使用方法也不费话了, 就是一个简单的全局函数封装, 不懂的看下源码中注释或Google.另外, 有兴趣的朋友,可以尝试在本插件基础上改一个可输入的下拉列表. 思路差不多,哈.演示及代码:... 阅读全文