摘要：
用table布局,相信大家都知道这是前端很诟病的事.但从HTML标签角度来看table标签,它的功能强大也是毋庸置疑的, 不然, 它也不会曾主导网站布局模式数年(甚至于现在仍有N多整站用table布局的网站). 但CSS+XHTML的兴起,使很多人开始妖魔化table这一标签,甚至以页面中是否有table来评判页面质量,这是不对的. table也有它存在的作用,很多页面功能(比如数据表格类,表单对... 阅读全文
摘要：
空白双边距是一个极容易误解的CSS特性.它不是CSS的bug,但如果我们一旦误解,将会给你带来很多麻烦.先看如下demo代码:<!doctype html><html><head><meta charset="utf-8"><title>空白边距叠加demo@Mr.Think</title><style>body{... 阅读全文
摘要：
据说,这是一个最近很流行的效果,新浪微博,腾讯微博,都用到了这种效果,本博开博时也追随潮流用上了这种效果,今天又在经典论坛中看到了这个效果.使用方法:在你的大图链接中加入class=”miniImg artZoom”例:<a class="miniImg artZoom" href="http://www.amostoys.com/images/460/graphic... 阅读全文
摘要：
如果你的网站是php的,通过下面的方法将能加速你网站的访问速度,无论加速多少,哪怕是0.01秒,你的网站在用户体验上就更进了一步。在尝试用如下方法前请为你的FirrFox(没有FireFox?移步前往)装上由Yahoo开发的YSlow插件(YSlow是什么？),然后用它分析一下你网站现在的分值是多少.切入正题,开始gzip压缩(本文以压缩css文件为例).第一步,建立压缩所需的php文件复制如下代... 阅读全文
摘要：
纯CSS实现的图片圆角边框效果,兼容IE6.实现原理很简单,利用绝对定位,使一个背景为PNG图片的边框覆盖在原始图片上面.而兼容IE6,本文用的是一段JS来让万恶的万万人诅咒的IE6识别PNG图片的.当然,你还可以用滤镜的方式让IE6实现PNG效果.本文后面我会附上两种解决方案.个人比较推崇用JS来实现IE6PNG,适应性比较强,但如果你只有一两处用到PNG,完全可以用滤镜的方式来实现.核心CSS... 阅读全文
摘要：
奇或偶数行高亮显示及鼠标莫过高亮显示,一个经常用到的效果,也能谷歌到大把的这种效果JS,但好像还没有一个封装成类直接用的.想象自己当初谷歌这个类时,还真没少折腾时间.花了点时间,封装成了一个类(附带一个添加样式的类),适合初学者,直接调用函数即可,无需改代码.核心JavaScript代码:点此查看DEMO//@Mr.Think---添加样式的类function addClass(elem,valu... 阅读全文
摘要：
分享一个简易的动画效果类,思路源于JavaScript DOM编程艺术,这本书是我JavaScript的启蒙书,看过四篇,至今时常翻起.我想也是每个JavaScript初学者的必备书.Mr.Think非常推崇这本书,真的很棒!思路其实很基础,很简单,主要是通过setTimeout()方法,并利用CSS绝对定位来以改变图片位置以实现动画效果.纯DOM方式编写,兼容所有支持JavaScript的浏览器... 阅读全文
摘要：
最近一直在研习JavaScript,CSS方面的知识关注的甚少.偶然间又看到这两道页面重构面试题,心血来潮,重温一下,呵.其实这两道题之前就做过,挺有意思.题一:分别用2个DIV,3个DIV,5个DIV实现水平垂直均居中显示一个宽50px,高200px的正十字架.思路:水平垂直均居中的实现,当然非absolute加外边距负值结合莫属.闲话略去,看代码及演示吧.2个DIV实现的核心CSS代码:点此查... 阅读全文
摘要：
最近写了两个管理后台的前端页面,其中有一个管理后台,左侧菜单导航和右侧内容页是两个iframe,需求是,点击上面的主导航时,左侧iframe和右侧iframe调用不同的链接.个人推荐用jQuery实现,代码简洁,扩展性强.jQuery部分:function gotourl(url_a, url_b){ $('#ifr_a').get(0).src = url_a; $('#ifr_b').get(... 阅读全文
摘要：
上次帮朋友写过的一个简单切换效果,超级简单,但也比较适用.因为用到了CSS Sprite技术,DEMO中附带了IE6兼容png的JS.核心JavaScript代码:点此查看DEMO//@Mr.Think获取对象属性兼容方法function $(objectId) {if(document.getElementById && document.getElementById(objec... 阅读全文