DIV CSS 佈局教程網

前段時間有個客戶說要做個像bbc一樣可以拖拽布局和編輯功能的網站。公司就讓我做了個Demo,基本實現了這些功能。 新聞中心窗口可以編輯,不過數據是靜態的，還沒加AJax。 目前只在IE6 和FF2.0下測試過，其他浏覽器還不知道。

事件格式化函數.書上的代碼。
// JavaScript Document
//事件格式化函數，摘自JavaScript高級程序一書 p258

var EventUtil = new Object;

EventUtil.addEventHandler = function(oTarget, sEventType, fnHandler){
    if( oTarget.addEventListener){
        oTarget.addEventListener(sEventType, fnHandler, false);
    }else if( oTarget.attachEvent ){
        oTarget.attachEvent("on" + sEventType, fnHandler);
    }else{
        oTarget["on" + sEventType] = fnHandler;
    }
};

EventUtil.removeEventHandler = function(oTarget, sEventType, fnHandler){
    if( oTarget.removeEventListener){
        oTarget.removeEventListener(sEventType, fnHandler, false);
    }else if( oTarget.detachEvent ){
        oTarget.detachEvent("on" + sEventType, fnHandler);
    }else{
        oTarget["on" + sEventType] = null;
    }
};

EventUtil.formatEvent = function(oEvent){
    if(document.all){
        oEvent.charCode = ( oEvent.type == "keypress" ) ? oEvent.keyCode : 0;
        oEvent.eventPhase = 2;
        oEvent.isChar = ( oEvent.charCode > 0 );
        oEvent.pageX = oEvent.clIEntX + document.body.scrollLeft;
        oEvent.pageY = oEvent.clIEntY + document.body.scrollTop;
        oEvent.preventDefault = function(){
            this.returnValue = false;
        };
        
        if( oEvent.type == "mouSEOut" ){
            oEvent.relatedTarget = oEvent.toElement;
        }else if( oEvent.type == "mouSEOver" ){
            oEvent.relatedTarget = oEvent.fromElement;
        }
        
        oEvent.stopPropagation = function(){
            this.cancelBubble = true;
        };
        
        oEvent.target = oEvent.srcElement;
        oEvent.time = (new Date()).getTime();
    }
    
    return oEvent;
};

EventUtil.getEvent = function(){
    if( window.event ){
        return this.formatEvent(window.event);
    }
    else{
        return EventUtil.getEvent.caller.arguments[0];
    }
};