共 22篇 前 3 页: 1 2 3    每页10篇 上一页   下一页  

逆水行舟

掌握 Ajax.
Ajax 由 HTML、JavaScript、DHTML 和 DOM 组成，这一杰出的方法可以将笨拙的 Web 界面转化成交互性的 Ajax 应用程序。本文的作者是一位 Ajax 专家，他演示了这些技术如何协同工作 -- 从总体概述到细节的讨论 -- 使高效的 Web 开发成为现实。他还揭开了 Ajax 核心概念的神秘面纱，包括 XMLHttpRequest 对象。

　　进一步学习请参考：

meiking   2008-04-10 01:58:53 阅读:32  评论:0  引用:0
Apache Rewrite学习(mod_rewrite模块).
互连网真是个好东西，不仅给了让我每个月能拿上些薪水，还提供给我们继续多拿些薪水的道路。感谢那些开源工程的工程师们，不仅提供了好工具，还教我们如何去用，真是好人做到底，送佛送到西啊。感谢互联网，感觉中国电信中国网通。

Apache Rewrite功能非常庞大，书到用时方恨少啊，找到两个不错的中文教程。

meiking   2008-04-10 01:57:53 阅读:61  评论:0  引用:0
w3c标准下的documentElement对象(DTD标识).
以前没怎么关心过w3c标准,一直以为w3c只是HTML和CSS的一种标准.最近我在做我们的 maidee.com 时被一个问题难到了,就是调用 window.onload 和 document.body 对象时网页上总是提示说此对象没有定义(undefined)或者其对象的值一直是零,我很不解,因为在做JS程序时我一般会用 editplus 调试好了再应用到系统中的,而在我调试时一切顺利的很,只要一放到系统里就会出现述对象. 在网上查了些资料才发现原来我们的 maidee.com 头部文件引用了 w3c 的标准
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> ,
而我调试时都没有加这一行. 这行代码就是定义网页是否遵循w3c标准的,自然JS和CSS以及HTML都得遵循其标准,而在标准里没有这两个对象. 调用这两个对象需要用document.documentElement  来代替.

后来经过一些测试还发现了 document.body 对象必须在 body 内容加载完才有值,而 document.documentElement 对象则在访问时就存在了. 当遵循标准时如果要访问body对象时 document.body window.body就会失效,相反 document.documentElement 就会失效. 不知道其它对象在标准下还会不会有另一套,一直找不到个象样的javascript手册.

如果有需要要了解w3c标准的话,阿捷在 www.w3cn.org 有一篇介绍w3c标准的文章,写的通欲易懂.
meiking   2008-04-10 01:57:27 阅读:233  评论:0  引用:0
ieHTTPHeaders工具。
IE的抓包工具，可以用来调试AJAX程序和顺便了解HTTP协议。以前调试AJAX程序都是用 tail -f 来看，现在有这工具就好方便多了。


其介绍及下载 ieHttpHeaders
meiking   2008-04-10 01:56:36 阅读:68  评论:0  引用:0
Javascript document.body部份对象(对象位置)。
document.body.clientWidth;   //网页可见区域宽
document.body.clientHeight;   //网页可见区域高
document.body.offsetWidth;    //网页可见区域宽 (包括边线和滚动条的宽)
document.body.offsetHeight;   //网页可见区域高 (包括边线的宽)
document.body.scrollWidth;    //网页正文全文宽
document.body.scrollHeight;   //网页正文全文高
document.body.scrollTop;      //网页被卷去的高
meiking   2008-04-10 01:55:21 阅读:198  评论:0  引用:0
类似Google ig和live.com的自由拖动窗口功能
代码写的比较复杂，我研究一上午了没全弄清楚，先留下来以便研究并为己用。

原文: How to Drag and Drop in JavaScript

我只选择了我想研究的部份，有兴趣的去看原文。

HTML部份:
<SCRIPT
      src="drag_drop.js"
      type=text/javascript></SCRIPT>
<STYLE type=text/css>LI {
    MARGIN-BOTTOM: 10px
}
OL {
    MARGIN-TOP: 5px
}
.DragContainer {
    BORDER-RIGHT: #669999 2px solid; PADDING-RIGHT: 5px; BORDER-TOP: #669999 2px solid; PADDING-LEFT: 5px; FLOAT: left; PADDING-BOTTOM: 0px; MARGIN: 3px; BORDER-LEFT: #669999 2px solid; WIDTH: 100px; PADDING-TOP: 5px; BORDER-BOTTOM: #669999 2px solid
}
.OverDragContainer {
    BORDER-RIGHT: #669999 2px solid; PADDING-RIGHT: 5px; BORDER-TOP: #669999 2px solid; PADDING-LEFT: 5px; FLOAT: left; PADDING-BOTTOM: 0px; MARGIN: 3px; BORDER-LEFT: #669999 2px solid; WIDTH: 100px; PADDING-TOP: 5px; BORDER-BOTTOM: #669999 2px solid
}
.OverDragContainer {
    BACKGROUND-COLOR: #eee
}
.DragBox {
    BORDER-RIGHT: #000 1px solid; PADDING-RIGHT: 2px; BORDER-TOP: #000 1px solid; PADDING-LEFT: 2px; FONT-SIZE: 10px; MARGIN-BOTTOM: 5px; PADDING-BOTTOM: 2px; BORDER-LEFT: #000 1px solid; WIDTH: 94px; CURSOR: pointer; PADDING-TOP: 2px; BORDER-BOTTOM: #000 1px solid; FONT-FAMILY: verdana, tahoma, arial; BACKGROUND-COLOR: #eee
}
.OverDragBox {
    BORDER-RIGHT: #000 1px solid; PADDING-RIGHT: 2px; BORDER-TOP: #000 1px solid; PADDING-LEFT: 2px; FONT-SIZE: 10px; MARGIN-BOTTOM: 5px; PADDING-BOTTOM: 2px; BORDER-LEFT: #000 1px solid; WIDTH: 94px; CURSOR: pointer; PADDING-TOP: 2px; BORDER-BOTTOM: #000 1px solid; FONT-FAMILY: verdana, tahoma, arial; BACKGROUND-COLOR: #eee
}
.DragDragBox {
    BORDER-RIGHT: #000 1px solid; PADDING-RIGHT: 2px; BORDER-TOP: #000 1px solid; PADDING-LEFT: 2px; FONT-SIZE: 10px; MARGIN-BOTTOM: 5px; PADDING-BOTTOM: 2px; BORDER-LEFT: #000 1px solid; WIDTH: 94px; CURSOR: pointer; PADDING-TOP: 2px; BORDER-BOTTOM: #000 1px solid; FONT-FAMILY: verdana, tahoma, arial; BACKGROUND-COLOR: #eee
}
.miniDragBox {
    BORDER-RIGHT: #000 1px solid; PADDING-RIGHT: 2px; BORDER-TOP: #000 1px solid; PADDING-LEFT: 2px; FONT-SIZE: 10px; MARGIN-BOTTOM: 5px; PADDING-BOTTOM: 2px; BORDER-LEFT: #000 1px solid; WIDTH: 94px; CURSOR: pointer; PADDING-TOP: 2px; BORDER-BOTTOM: #000 1px solid; FONT-FAMILY: verdana, tahoma, arial; BACKGROUND-COLOR: #eee
}
.OverDragBox {
    BACKGROUND-COLOR: #ffff99
}
.DragDragBox {
    BACKGROUND-COLOR: #ffff99
}
.DragDragBox {
    FILTER: alpha(opacity=50); BACKGROUND-COLOR: #ff99cc
}
LEGEND {
    FONT-WEIGHT: bold; FONT-SIZE: 12px; COLOR: #666699; FONT-FAMILY: verdana, tahoma, arial
}
FIELDSET {
    PADDING-RIGHT: 3px; PADDING-LEFT: 3px; PADDING-BOTTOM: 3px; PADDING-TOP: 3px
}
.History {
    FONT-SIZE: 10px; OVERFLOW: auto; WIDTH: 100%; FONT-FAMILY: verdana, tahoma, arial; HEIGHT: 82px
}
#DragContainer8 {
    BORDER-RIGHT: #669999 1px solid; PADDING-RIGHT: 0px; BORDER-TOP: #669999 1px solid; PADDING-LEFT: 5px; PADDING-BOTTOM: 0px; BORDER-LEFT: #669999 1px solid; WIDTH: 110px; PADDING-TOP: 5px; BORDER-BOTTOM: #669999 1px solid; HEIGHT: 110px
}
.miniDragBox {
    FLOAT: left; MARGIN: 0px 5px 5px 0px; WIDTH: 20px; HEIGHT: 20px
}
PRE {
    BORDER-RIGHT: #ccc 1px solid; PADDING-RIGHT: 10px; BORDER-TOP: #ccc 1px solid; PADDING-LEFT: 10px; PADDING-BOTTOM: 10px; BORDER-LEFT: #ccc 1px solid; PADDING-TOP: 10px; BORDER-BOTTOM: #ccc 1px solid; BACKGROUND-COLOR: #f8f8f0
}
</STYLE>
<body>
<FIELDSET id=Demo4><LEGEND>样例- 拖拽页面元素</LEGEND>
      <DIV>
        <DIV class=DragContainer id=DragContainer4 overclass="OverDragContainer">
            <DIV class=DragBox id=Item1 overclass="OverDragBox" dragclass="DragDragBox">Item #1</DIV>
            <DIV class=DragBox id=Item2 overclass="OverDragBox" dragclass="DragDragBox">Item #2</DIV>
            <DIV class=DragBox id=Item3 overclass="OverDragBox" dragclass="DragDragBox">Item #3</DIV>
            <DIV class=DragBox id=Item4 overclass="OverDragBox" dragclass="DragDragBox">Item #4</DIV>
        </DIV>
       
        <DIV class=DragContainer id=DragContainer5 overclass="OverDragContainer">
            <DIV class=DragBox id=Item5 overclass="OverDragBox" dragclass="DragDragBox">Item #5</DIV>
            <DIV class=DragBox id=Item6 overclass="OverDragBox" dragclass="DragDragBox">Item #6</DIV>
            <DIV class=DragBox id=Item7 overclass="OverDragBox" dragclass="DragDragBox">Item #7</DIV>
            <DIV class=DragBox id=Item8 overclass="OverDragBox" dragclass="DragDragBox">Item #8</DIV>
        </DIV>
       
        <DIV class=DragContainer id=DragContainer6 overclass="OverDragContainer">
            <DIV class=DragBox id=Item9 overclass="OverDragBox" dragclass="DragDragBox">Item #9</DIV>
            <DIV class=DragBox id=Item10 overclass="OverDragBox" dragclass="DragDragBox">Item #10</DIV>
            <DIV class=DragBox id=Item11 overclass="OverDragBox" dragclass="DragDragBox">Item #11</DIV>
            <DIV class=DragBox id=Item12 overclass="OverDragBox" dragclass="DragDragBox">Item #12</DIV>
        </DIV>
    </DIV>
</FIELDSET>

</body>
</html>


Javascript部份:
var Demos       = [];
var nDemos      = 8;

var mouseOffset = null;
var iMouseDown  = false;
var lMouseState = false;
var dragObject  = null;

// Demo 0 variables
var DragDrops   = [];
var curTarget   = null;
var lastTarget  = null;
var dragHelper  = null;
var tempDiv     = null;
var rootParent  = null;
var rootSibling = null;
var nImg        = new Image();

nImg.src        = 'images/drag_drop_poof.gif';

// Demo1 variables
var D1Target    = null;

Number.prototype.NaN0=function(){return isNaN(this)?0:this;}

function CreateDragContainer(){
    /*
    Create a new "Container Instance" so that items from one "Set" can not
    be dragged into items from another "Set"
    */

    var cDrag        = DragDrops.length;
    DragDrops[cDrag] = [];

    /*
    Each item passed to this function should be a "container".  Store each
    of these items in our current container
    */

    for(var i=0; i<arguments.length; i++){
        var cObj = arguments[i];
        DragDrops[cDrag].push(cObj);
        cObj.setAttribute('DropObj', cDrag);

        /*
        Every top level item in these containers should be draggable.  Do this
        by setting the DragObj attribute on each item and then later checking
        this attribute in the mouseMove function
        */
        for(var j=0; j<cObj.childNodes.length; j++){

            // Firefox puts in lots of #text nodes...skip these
            if(cObj.childNodes[j].nodeName=='#text') continue;

            cObj.childNodes[j].setAttribute('DragObj', cDrag);
        }
    }
}

function getPosition(e){
    var left = 0;
    var top  = 0;
    while (e.offsetParent){
        left += e.offsetLeft + (e.currentStyle?(parseInt(e.currentStyle.borderLeftWidth)).NaN0():0);
        top  += e.offsetTop  + (e.currentStyle?(parseInt(e.currentStyle.borderTopWidth)).NaN0():0);
        e     = e.offsetParent;
    }

    left += e.offsetLeft + (e.currentStyle?(parseInt(e.currentStyle.borderLeftWidth)).NaN0():0);
    top  += e.offsetTop  + (e.currentStyle?(parseInt(e.currentStyle.borderTopWidth)).NaN0():0);

    return {x:left, y:top};

}

function mouseCoords(ev){
    if(ev.pageX || ev.pageY){
        return {x:ev.pageX, y:ev.pageY};
    }
    return {
        x:ev.clientX + document.body.scrollLeft - document.body.clientLeft,
        y:ev.clientY + document.body.scrollTop  - document.body.clientTop
    };
}

function writeHistory(object, message){
    if(!object || !object.parentNode || !object.parentNode.getAttribute) return;
    var historyDiv = object.parentNode.getAttribute('history');
    if(historyDiv){
        historyDiv = document.getElementById(historyDiv);
        historyDiv.appendChild(document.createTextNode(object.id+': '+message));
        historyDiv.appendChild(document.createElement('BR'));

        historyDiv.scrollTop += 50;
    }
}

function getMouseOffset(target, ev){
    ev = ev || window.event;

    var docPos    = getPosition(target);
    var mousePos  = mouseCoords(ev);
    return {x:mousePos.x - docPos.x, y:mousePos.y - docPos.y};
}

function mouseMove(ev){
    ev         = ev || window.event;

    var target   = ev.target || ev.srcElement;
    var mousePos = mouseCoords(ev);

    if(Demos[0] || Demos[4]){
        // mouseOut event - fires if the item the mouse is on has changed
        if(lastTarget && (target!==lastTarget)){
            writeHistory(lastTarget, 'Mouse Out Fired');

            // reset the classname for the target element
            var origClass = lastTarget.getAttribute('origClass');
            if(origClass) lastTarget.className = origClass;
        }

        var dragObj = target.getAttribute('DragObj');

         // if the mouse was moved over an element that is draggable
        if(dragObj!=null){

            // mouseOver event - Change the item's class if necessary
            if(target!=lastTarget){
                writeHistory(target, 'Mouse Over Fired');

                var oClass = target.getAttribute('overClass');
                if(oClass){
                    target.setAttribute('origClass', target.className);
                    target.className = oClass;
                }
            }

            // if the user is just starting to drag the element
            if(iMouseDown && !lMouseState){
                writeHistory(target, 'Start Dragging');
                // mouseDown target
                curTarget     = target;

                // Record the mouse x and y offset for the element
                rootParent    = curTarget.parentNode;
                rootSibling   = curTarget.nextSibling;

                mouseOffset   = getMouseOffset(target, ev);

                // We remove anything that is in our dragHelper DIV so we can put a new item in it.
                for(var i=0; i<dragHelper.childNodes.length; i++) {
                    dragHelper.removeChild(dragHelper.childNodes[i]);
                }

                // Make a copy of the current item and put it in our drag helper.
                dragHelper.appendChild(curTarget.cloneNode(true));
                dragHelper.style.display = 'block';

                // set the class on our helper DIV if necessary
                var dragClass = curTarget.getAttribute('dragClass');
                if(dragClass){
                    dragHelper.firstChild.className = dragClass;
                }

                // disable dragging from our helper DIV (it's already being dragged)
                dragHelper.firstChild.removeAttribute('DragObj');

                var dragConts = DragDrops[dragObj];

                curTarget.setAttribute('startWidth',  parseInt(curTarget.offsetWidth));
                curTarget.setAttribute('startHeight', parseInt(curTarget.offsetHeight));
                curTarget.style.display  = 'none';

                // loop through each possible drop container
                for(var i=0; i<dragConts.length; i++){
                    with(dragConts[i]){
                        var pos = getPosition(dragConts[i]);
                        setAttribute('startWidth',  parseInt(offsetWidth));
                        setAttribute('startHeight', parseInt(offsetHeight));
                        setAttribute('startLeft',   pos.x);
                        setAttribute('startTop',    pos.y);
                    }

                    // loop through each child element of each container
                    for(var j=0; j<dragConts[i].childNodes.length; j++){
                        with(dragConts[i].childNodes[j]){
                            if((nodeName=='#text') || (dragConts[i].childNodes[j]==curTarget)) continue;

                            var pos = getPosition(dragConts[i].childNodes[j]);

                            // save the width, height and position of each element
                            setAttribute('startWidth',  parseInt(offsetWidth));
                            setAttribute('startHeight', parseInt(offsetHeight));
                            setAttribute('startLeft',   pos.x);
                            setAttribute('startTop',    pos.y);
                        }
                    }
                }
            }
        }

        // If we get in here we are dragging something
        if(curTarget){
            // move our helper div to wherever the mouse is (adjusted by mouseOffset)
            dragHelper.style.top  = mousePos.y - mouseOffset.y;
            dragHelper.style.left = mousePos.x - mouseOffset.x;

            var dragConts  = DragDrops[curTarget.getAttribute('DragObj')];
            var activeCont = null;

            var xPos = mousePos.x - mouseOffset.x + (parseInt(curTarget.getAttribute('startWidth')) /2);
            var yPos = mousePos.y - mouseOffset.y + (parseInt(curTarget.getAttribute('startHeight'))/2);

            // check each drop container to see if our target object is "inside" the container
            for(var i=0; i<dragConts.length; i++){
                with(dragConts[i]){
                    if((parseInt(getAttribute('startLeft'))                                           < xPos) &&
                        (parseInt(getAttribute('startTop'))                                            < yPos) &&
                        ((parseInt(getAttribute('startLeft')) + parseInt(getAttribute('startWidth')))  > xPos) &&
                        ((parseInt(getAttribute('startTop'))  + parseInt(getAttribute('startHeight'))) > yPos)){

                            activeCont = dragConts[i];

                            // exit the for loop
                            break;
                    }
                }
            }

            // Our target object is in one of our containers.  Check to see where our div belongs
            if(activeCont){
                if(activeCont!=curTarget.parentNode){
                    writeHistory(curTarget, 'Moved into '+activeCont.id);
                }

                // beforeNode will hold the first node AFTER where our div belongs
                var beforeNode = null;

                // loop through each child node (skipping text nodes).
                for(var i=activeCont.childNodes.length-1; i>=0; i--){
                    with(activeCont.childNodes[i]){
                        if(nodeName=='#text') continue;

                        // if the current item is "After" the item being dragged
                        if(curTarget != activeCont.childNodes[i]                                                  &&
                            ((parseInt(getAttribute('startLeft')) + parseInt(getAttribute('startWidth')))  > xPos) &&
                            ((parseInt(getAttribute('startTop'))  + parseInt(getAttribute('startHeight'))) > yPos)){
                                beforeNode = activeCont.childNodes[i];
                        }
                    }
                }

                // the item being dragged belongs before another item
                if(beforeNode){
                    if(beforeNode!=curTarget.nextSibling){
                        writeHistory(curTarget, 'Inserted Before '+beforeNode.id);

                        activeCont.insertBefore(curTarget, beforeNode);
                    }

                // the item being dragged belongs at the end of the current container
                } else {
                    if((curTarget.nextSibling) || (curTarget.parentNode!=activeCont)){
                        writeHistory(curTarget, 'Inserted at end of '+activeCont.id);

                        activeCont.appendChild(curTarget);
                    }
                }

                // the timeout is here because the container doesn't "immediately" resize
                setTimeout(function(){
                var contPos = getPosition(activeCont);
                activeCont.setAttribute('startWidth',  parseInt(activeCont.offsetWidth));
                activeCont.setAttribute('startHeight', parseInt(activeCont.offsetHeight));
                activeCont.setAttribute('startLeft',   contPos.x);
                activeCont.setAttribute('startTop',    contPos.y);}, 5);

                // make our drag item visible
                if(curTarget.style.display!=''){
                    writeHistory(curTarget, 'Made Visible');
                    curTarget.style.display    = '';
                    curTarget.style.visibility = 'hidden';
                }
            } else {

                // our drag item is not in a container, so hide it.
                if(curTarget.style.display!='none'){
                    writeHistory(curTarget, 'Hidden');
                    curTarget.style.display  = 'none';
                }
            }
        }

        // track the current mouse state so we can compare against it next time
        lMouseState = iMouseDown;

        // mouseMove target
        lastTarget  = target;
    }
    if(dragObject){
        dragObject.style.position = 'absolute';
        dragObject.style.top      = mousePos.y - mouseOffset.y;
        dragObject.style.left     = mousePos.x - mouseOffset.x;
    }

    // track the current mouse state so we can compare against it next time
    lMouseState = iMouseDown;

    // this prevents items on the page from being highlighted while dragging
    if(curTarget || dragObject) return false;
}

function mouseUp(ev){

    if(Demos[0] || Demos[4]){
        if(curTarget){
            writeHistory(curTarget, 'Mouse Up Fired');

            dragHelper.style.display = 'none';
            if(curTarget.style.display == 'none'){
                if(rootSibling){
                    rootParent.insertBefore(curTarget, rootSibling);
                } else {
                    rootParent.appendChild(curTarget);
                }
            }
            curTarget.style.display    = '';
            curTarget.style.visibility = 'visible';
        }
        curTarget  = null;
    }
    dragObject = null;

    iMouseDown = false;
}

function mouseDown(ev){
    ev         = ev || window.event;
    var target = ev.target || ev.srcElement;
    iMouseDown = true;
    if(Demos[0] || Demos[4]){
        if(lastTarget){
            writeHistory(lastTarget, 'Mouse Down Fired');
        }
    }
    if(target.onmousedown || target.getAttribute('DragObj')){
        return false;
    }
}

function makeDraggable(item){
    if(!item) return;
    item.onmousedown = function(ev){
        dragObject  = this;
        mouseOffset = getMouseOffset(this, ev);
        return false;
    }
}

function makeClickable(item){
    if(!item) return;
    item.onmousedown = function(ev){
        document.getElementById('ClickImage').value = this.name;
    }
}

function addDropTarget(item, target){
    item.setAttribute('droptarget', target);
}

document.onmousemove = mouseMove;
document.onmousedown = mouseDown;
document.onmouseup   = mouseUp;

window.onload = function(){
    for(var i=0; i<nDemos; i++){
        Demos[i] = document.getElementById('Demo'+i);
    }
    if(Demos[4]){
        CreateDragContainer(document.getElementById('DragContainer4'), document.getElementById('DragContainer5'), document.getElementById('DragContainer6'));
    }
    if(Demos[0] || Demos[4]){
        // Create our helper object that will show the item while dragging
        dragHelper = document.createElement('DIV');
        dragHelper.style.cssText = 'position:absolute;display:none;';

        document.body.appendChild(dragHelper);
    }
}

meiking   2008-04-10 01:54:29 阅读:32  评论:0  引用:0
IE和Firefox下使层的透明方法
代码:
<div style="width :
100px; height : 100px; background-color : #f00; filter:alpha(opacity=50);
/* IE */ ; -moz-opacity:0.5; /* Moz + FF */ ; opacity: 0.5; /* 支持CSS3的浏
览器（FF 1.5也支持）*/">
我在任何浏览器里都是半透明的
div>
meiking   2008-04-10 01:52:52 阅读:115  评论:0  引用:0
做一个提示窗口取代系统的 alert();
系统自带的 alert() 比较烦人，因为会覆盖页面且有声音，其实最有直接的就是人们已经不喜欢这种提示信息。
我做了个小的 提示窗，效果还行，这是算是做一个备份，大家需要的话也可以顺便服务大众。 大概效果是一个方块从浏览器的正上方移动到页面上方边缘，点击关闭或一定时间后会渐隐掉。

代码：
function fromID(id) {
return document.getElementById(id);
}

function show_alert(msg, type, time) {
var layer_obj = fromID("alert_layer");
var layer_text= fromID("alert_text");
var line_height = (document.documentElement.scrollTop == 0) ? document.body.scrollTop : document.documentElement.scrollTop;

layer_text.innerHTML = msg;
with(layer_obj.style) {
zIndex = 999;
top = line_height-40;
left = document.body.clientWidth/3;
display = "block";
position = "absolute";
if(type == "error") {
background = "url(http://"+style_domain+"/snake/index/msgbox_right_bg2.jpg)";
}
}

layer_obj.filters[0].opacity = "0.8"; //透明度为 80%

if(time == undefined) time = 3000;
else time = time*1000;

var top = line_height-40;
var speed = 1.5;
time-= 1000;
//控制窗口向下移动至页面边缘
move_down = function MoveFplogo() {
top+= speed;
layer_obj.style.top = top;
if(top < line_height) setTimeout("move_down()", 1);
else setTimeout("close_alert_win()", time);
}

move_down();
}

function close_alert_win() {
var layer_obj = fromID("alert_layer");
//控制窗口渐渐消失
if(layer_obj.filters[0].opacity < 0.02) {
layer_obj.style.display = "none";
return true;
}
layer_obj.filters[0].opacity-= 0.02;
setTimeout("close_alert_win()", 1);
}
document.writeln(" ");


调用时直接 javascript: show_alert("信息"); 就行了,如果是想报错的话可以在第二个参数中输入 "error",第三个参数是时间，默认为 3秒后消失。
meiking   2008-04-10 01:50:37 阅读:39  评论:0  引用:0
WinXP IE浏览器Runtime Error!
2006-08-09 09:45:10  By: 谢智

前一段时间我们开发的占座网(http://www.zhanzuo.com)一直有用户提出在注册时报如下图错误,在公司这种错误也能重现,包括我自己的电脑,当时分析结果就是因为QQ的流氓插件引起的,在禁用QQ相关插件后发现问题解决.

错误如图:

然而占座的用户大部份都有安装QQ,此问题必须要解决,今天再次尝试解决此问题终于有了重大突破!

... ...

因为问题只在注册页面,所以问题肯定是和注册页面的某些相关程序引起的,注册页面和其它页面不同的地方有FLASH、Javascript和CSS代码,因此尝试了以下几个步骤:
  1. 因为感觉FLASH代码是和插件直接挂勾的,所以先注释所有FLASH相关代码,结果问题依旧.
  2. 然后Javascript是在客户端执行的,所以嫌疑比较重 -> 注释所以JS代码,结果发现问题还没有排除.
  3.  那么问题可能锁定在HTML代码和CSS代码了,因为CSS代码是独立引用进来的,查起来方便,所以先查CSS问题 -> 注释所有CSS代码,发现问题排除!! 那么好了,问题肯定是出在CSS上了,注册页面引用了两个CSS,有上面排除法排除掉一个CSS,最终问题锁定在 /css/reg.css 上,利用二分法找到引起问题的代码,然后解决.

 问题目前已经解决,引起”Runtime Error”的代码是

.reg_seq li {

         margin-left: 12px;

         }

在把 “reg_seq”名称修改后错误不再出现,我不知道为什么这段css代码为什么会引发错误,可能是与插件产生冲突,而且错误在我机器上产生率在90%以上,根本没想到问题会出现在CSS里,后来一位JS高手告诉我很有可能是css命名不合理,有可能与注册表里的相关键产生冲突.;">而且错误在我机器上产生率在90%以上,根本没想到问题会出现在CSS里,后来一位JS高手告诉我很有可能是css命名不合理,有可能与注册表里的相关键产生冲突.family: Arial;">90%以上,根本没想到问题会出现在CSS里,后来一位JS高手告诉我很有可能是css命名不合理,有可能与注册表里的相关键产生冲突.;">而且错误在我机器上产生率在90%以上,根本没想到问题会出现在CSS里,后来一位JS高手告诉我很有可能是css命名不合理,有可能与注册表里的相关键产生冲突.
meiking   2008-04-10 01:05:33 阅读:300  评论:0  引用:0
Vim 实用技术
2006-04-06 17:58:45  By: 谢智
工作一年来,天天都在用VIM,因为确实好用,今天看到两篇有关VIM技术的,发现VIM还有好玩的.

Vim 实用技术，第 1 部分: 实用技巧


              Vim 实用技术，第 3 部分: 定制 Vim
meiking   2008-04-10 00:59:51 阅读:11  评论:0  引用:0
Copyright@2008 powered by YuLog