别忘记 CSS Naked Day

2008-04-05

今年的 CSS Naked Day 似乎很多人都忘记了。而去年的这个「节日」甚至淘宝网都参加了。下面是其官方的一些介绍

The idea behind this event is to promote Web Standards. 
Plain and simple. This includes proper use of (x)html, 
semantic markup, a good hierarchy structure, and of 
course, a good 'ol play on words. It's time to show off
your <body>.

创办这个「活动」并不是为了好玩，而是提倡 Web 开发人员使用具有良好结构的 HTML 。当然，完全抛弃 CSS 呈现页面的默认样式，是需要「勇气」的。

本人认为，如果条件允许的话，建议有兴趣的都可以参加。例如本人的 Blog 「脱掉」 CSS 样式以后，会是这个样子（看起来非常丑）。

作为对比，再贴张「正常」的

如果不想浪费时间写相应的代码，可以使用官方提供的 PHP 函数（当然，也可以使用 Javascript 实现）。

= $start && $now <= $end ) {
        return true;
    }
    return false;
}
?>

Javascript 悬停弹出框

2008-04-03

由于项目的需要，要做一个鼠标悬停显示信息的效果。坦白说，我这个部件我不想使用框架实现，原因是太臃肿了。

在代码库里面找到了些类似的代码（本人为业余的 Javascript 开发人员），但发现都非常的散乱，于是我就尝试重写它们。

先看下 DEMO ，打包以后的文件可以在这里下载。

用法很简单，就是在函数参数中选择容器的 id（或者是节点集合），然后代码就会将容器中 a 元素的 title 和链接以泡框的形式弹出。

下面，说下碰到的些值得回味的代码（格式是我重写以后的）。

_addCssFile : function (css_file) {
    var l = document.createElement("link");
    l.setAttribute("type",  "text/css");
    l.setAttribute("rel",   "stylesheet");
    l.setAttribute("href",  css_file);
    l.setAttribute("media", "screen");
    document.getElementsByTagName("head")[0].appendChild(l);
},

用 Javascript 载入外部样式文件，建议在 DOM Ready 以后运行。

_setOpacity: function (oNode) {
    oNode.style.filter       = "alpha(opacity:85)";
    oNode.style.KHTMLOpacity = "0.85";
    oNode.style.MozOpacity   = "0.85";
    oNode.style.opacity      = "0.85";
},

强行设置元素的属性，不像 YUI 这样小心翼翼的先判断后操作，再设置。我等草根的写出来代码，虽然「暴力」，但是实用。

类似的，还有

var posx = 0, posy = 0;
if(e == null) {
    e = window.event;
}

if(e.pageX || e.pageY) {
    posx=e.pageX; posy=e.pageY;
} else if(e.clientX || e.clientY) {
    if(document.documentElement.scrollTop){
        posx = e.clientX + document.documentElement.scrollLeft;
        posy = e.clientY + document.documentElement.scrollTop;
    } else {
        posx = e.clientX + document.body.scrollLeft;
        posy = e.clientY + document.body.scrollTop;
    }
}

获取当前元素的坐标 -- 写过类似功能的朋友，应该对此段代码很熟悉。