本站首页    管理页面    写新日志    退出

The Neurotic Fishbowl

[RIA]自己写的demo，鼠标来回拖拽，有待于优化，支持ff和ie
snowrose 发表于 2008/11/23 12:34:27

由于这个可恶的blog不支持firefox浏览器，所以图片不能上传，我实在受不了，决定用qq－zone写blog了　<html><head><meta http-equiv="Content-Type" content="text/html; charset=gb-2312"><title>Tsensor easy</title><style><!--td,div{ font-size: 9pt }--></style><script language="javascript">function aa(str){ alert("ÌáÊŸ:"+str); } function makedot(x,y,c,d1,d2){ //»­µãº¯Êý   document.write("<div style='height:"+d1+"px;position:absolute;z-index: 99;left:"+x+"px;top:"+y+"px;width:"+d2+"px;background:"+c+";overflow:hidden'></div>")  }  function makediv(x,y,c,d1,d2,s,id){ //»­divº¯Êý   document.write("<div id="+id+" style='border-style: solid; border-width: 1px;height:"+d1+"px;position:absolute;left:"+x+"px;top:"+y+"px;width:"+d2+"px;background:"+c+";overflow:hidden'>"+s+"</div>")  }  function makediv0(x,y,c,d1,d2,s,id){ //»­divº¯Êý   document.write("<div id="+id+" style='height:"+d1+"px;position:absolute;left:"+x+"px;top:"+y+"px;width:"+d2+"px;background:"+c+";overflow:hidden'>"+s+"</div>")  }  function line(x1,y1,x2,y2,c,d1,d2){   var slope=(y2-y1)/(x2-x1); //бÂÊ   var diff=x2-x1;   if(x1<x2){    for(var i=0;i<diff;i++){     makedot(x1+i,y1+slope*i,c,d1,d2);    }   }else if(x1>x2){    for(var i=0;i>diff;i--){     makedot(x1+i,y1+slope*i,c,d1,d2);    }   }else{ //»­Ž¹Ö±Ïß    var temp=y2-y1;    if(temp>0){     for(var i=0;i<temp;i++){      makedot(x1,y1+i,c,d1,d2);     }    }else{     for(var i=0;i>temp;i--){      makedot(x1,y1+i,c,d1,d2);     }    }   }  }  function temper(x,y,d,s){ line(x,y,x+d,y,'#D5AAAA',20,1); line(x+d,y,x+d*2,y,'#DFDFDF',20,1); line(x+d*2,y,x+d*3,y,'#DFC1DE',20,1); line(x+d*3,y,x+d*4,y,'#FF00FF',20,1); line(x+d*4,y,x+d*5,y,'#ee0000',20,1); line(x+s,y-5,x+s,y+20,'#0000ff',5,5); }function drawtemp3(x,y,s){var s2=s*2.5;s='<font color=#0000FF>'+s+'</font>'y+=17;line(x+s2-2,y-30,x+s2-2,y-12,'#0000ff',3,3); makediv0(x+s2,y-10,'#FFF',10,40,s);}//drawtemp3(10,30,60);</script><style>#TM1,#TM2,#TM3,#TM4,#TM5{    border-style: solid;    border-width: 1px;    position: absolute;    width: 50px;     height: 12px;    z-index: 2;    top: 15px;}#TM2X,#TM3X,#TM4X,#TM5X{    /*border-style: solid;    border-width: 1px;*/    position: absolute;    background-color: rgb(0, 255, 0);    width: 3px;     height: 12px;    z-index: 10;    top: 15px;}#TM2X:hover{    cursor : w-resize;}#trace{    color : red;    font-size : 14px;    background-color : #000;    width:600px;}</style></head><body><div style="left: 10px;background-color: #D5AAAA;position:absolute;width: 50px;height: 12px;z-index: 2;top: 15px;" id="TM1"></div><div style="left: 60px;position:absolute;cursor:w-resize;" id="TM2X"></div><div style="left: 60px; background-color: #DFDFDF;position:absolute;width: 50px;height: 12px;z-index: 2;top: 15px;" id="TM2">20</div><div style="left: 110px;position: absolute;cursor:w-resize;" id="TM3X"></div> <div style="left: 110px;background-color: #DFC1DE;position:absolute;width: 50px;height: 12px;z-index: 2;top: 15px;" id="TM3"> 40</div><div style="left: 160px;position: absolute;cursor:w-resize;" id="TM4X"></div> <div style="left: 160px;background-color:#FF00FF;position:absolute;width: 50px;height: 12px;z-index: 2;top: 15px;" id="TM4"> 60</div><div style="left: 210px;position: absolute;cursor:w-resize;" id="TM5X"></div>  <div style="left: 210px;background-color:#EE0000;position:absolute;width: 50px;height: 12px;z-index: 2;top: 15px;" id="TM5"> 80</div><p><br>¡¡</p><div style="position: absolute; width: 265px; height: 13px; z-index: 13; left: 9px; top: 32px;" id="layer1">  <table id="table1" border="0" cellpadding="0" cellspacing="0" width="265"><tbody><tr>    <td id="lcell6" style="font-size: 9pt;">0    </td>    <td id="lcell7" style="font-size: 9pt;">¡¡</td>    <td id="lcell8" style="font-size: 9pt;">¡¡</td>    <td id="lcell9" style="font-size: 9pt;">¡¡</td>    <td id="lcell10" style="font-size: 9pt;">    <p align="right">100</p></td>  </tr></tbody></table>   </div> <div style="position: absolute; width: 9px; height: 14px; z-index: 100; left: 10px; top: 51px;" id="layer3">   <input value="M" name="cancel0" style="border-style: solid; border-width: 1px; padding: 1px 1px 2px; width: 17px; color: rgb(0, 128, 128); background-color: rgb(223, 223, 223); height: 17px;" onclick="if(document.getElementById('layer4').style.display=='none'){                      document.getElementById('layer4').style.display='';                      }else{                       document.getElementById('layer4').style.display='none';}                       " type="button"></div><div style="display: none; position: absolute; width: 215px; height: 27px; z-index: 101; left: 45px; top: 46px;" id="layer4"><table style="border-collapse: collapse;" id="table2" border="0" cellpadding="0" width="214">  <tbody><tr>     <td style="font-size: 9pt;" align="center" height="26" width="29">     <input readonly="true" id="alarm1" size="6" style="border-style: solid; border-width: 1px; height: 18px; background-color: rgb(213, 170, 170); padding-top: 1px;" value="20" type="text"></td>         <td style="font-size: 9pt;" align="center" height="26" width="24">     <input readonly="true" id="alarm2" size="6" style="border-style: solid; border-width: 1px; height: 18px; background-color: rgb(223, 223, 223); padding-top: 1px;" value="40" type="text"></td>         <td style="font-size: 9pt;" align="center" height="26" width="29">     <input readonly="true" id="alarm3" size="6" style="border-style: solid; border-width: 1px; height: 18px; background-color: rgb(223, 193, 222); padding-top: 1px;" value="60" type="text"></td>         <td style="font-size: 9pt;" align="center" height="26" width="21">     <input readonly="true" id="alarm4" size="6" style="border-style: solid; border-width: 1px; height: 18px; background-color: rgb(255, 0, 255); padding-top: 1px;" value="80" type="text"></td>    <td style="font-size: 9pt;" align="center" height="26" width="6"> ¡¡</td>    <td style="font-size: 9pt;" height="26" width="108">     <p align="center">    <input value="Save" id="save" style="border: 1px solid rgb(0, 128, 128); padding: 1px 2px; width: 35px; color: rgb(0, 128, 128); background-color: rgb(223, 223, 223); height: 17px;" type="submit">    <input value="Cancel" id="cancel" style="border: 1px solid rgb(0, 128, 128); padding: 1px 2px; width: 46px; color: rgb(0, 128, 128); background-color: rgb(223, 223, 223); height: 17px;" onclick="location.reload();" type="button"></p></td>  </tr>  </tbody></table>  </div><script>curvalue=52.5;drawtemp3(10,25,curvalue);</script><div style="background: rgb(0, 0, 255) none repeat scroll 0%; overflow: hidden; height: 3px; position: absolute; z-index: 99; left: 139.25px; top: 12px; width: 3px; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"></div><div style="background: rgb(0, 0, 255) none repeat scroll 0%; overflow: hidden; height: 3px; position: absolute; z-index: 99; left: 139.25px; top: 13px; width: 3px; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"></div><div style="background: rgb(0, 0, 255) none repeat scroll 0%; overflow: hidden; height: 3px; position: absolute; z-index: 99; left: 139.25px; top: 14px; width: 3px; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"></div><div style="background: rgb(0, 0, 255) none repeat scroll 0%; overflow: hidden; height: 3px; position: absolute; z-index: 99; left: 139.25px; top: 15px; width: 3px; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"></div><div style="background: rgb(0, 0, 255) none repeat scroll 0%; overflow: hidden; height: 3px; position: absolute; z-index: 99; left: 139.25px; top: 16px; width: 3px; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"></div><div style="background: rgb(0, 0, 255) none repeat scroll 0%; overflow: hidden; height: 3px; position: absolute; z-index: 99; left: 139.25px; top: 17px; width: 3px; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"></div><div style="background: rgb(0, 0, 255) none repeat scroll 0%; overflow: hidden; height: 3px; position: absolute; z-index: 99; left: 139.25px; top: 18px; width: 3px; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"></div><div style="background: rgb(0, 0, 255) none repeat scroll 0%; overflow: hidden; height: 3px; position: absolute; z-index: 99; left: 139.25px; top: 19px; width: 3px; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"></div><div style="background: rgb(0, 0, 255) none repeat scroll 0%; overflow: hidden; height: 3px; position: absolute; z-index: 99; left: 139.25px; top: 20px; width: 3px; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"></div><div style="background: rgb(0, 0, 255) none repeat scroll 0%; overflow: hidden; height: 3px; position: absolute; z-index: 99; left: 139.25px; top: 21px; width: 3px; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"></div><div style="background: rgb(0, 0, 255) none repeat scroll 0%; overflow: hidden; height: 3px; position: absolute; z-index: 99; left: 139.25px; top: 22px; width: 3px; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"></div><div style="background: rgb(0, 0, 255) none repeat scroll 0%; overflow: hidden; height: 3px; position: absolute; z-index: 99; left: 139.25px; top: 23px; width: 3px; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"></div><div style="background: rgb(0, 0, 255) none repeat scroll 0%; overflow: hidden; height: 3px; position: absolute; z-index: 99; left: 139.25px; top: 24px; width: 3px; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"></div><div style="background: rgb(0, 0, 255) none repeat scroll 0%; overflow: hidden; height: 3px; position: absolute; z-index: 99; left: 139.25px; top: 25px; width: 3px; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"></div><div style="background: rgb(0, 0, 255) none repeat scroll 0%; overflow: hidden; height: 3px; position: absolute; z-index: 99; left: 139.25px; top: 26px; width: 3px; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"></div><div style="background: rgb(0, 0, 255) none repeat scroll 0%; overflow: hidden; height: 3px; position: absolute; z-index: 99; left: 139.25px; top: 27px; width: 3px; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"></div><div style="background: rgb(0, 0, 255) none repeat scroll 0%; overflow: hidden; height: 3px; position: absolute; z-index: 99; left: 139.25px; top: 28px; width: 3px; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"></div><div style="background: rgb(0, 0, 255) none repeat scroll 0%; overflow: hidden; height: 3px; position: absolute; z-index: 99; left: 139.25px; top: 29px; width: 3px; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"></div><div id="undefined" style="background: rgb(255, 255, 255) none repeat scroll 0%; overflow: hidden; height: 10px; position: absolute; left: 141.25px; top: 32px; width: 40px; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"><font color="#0000ff">52.5</font></div><div id="trace"></div><script type="text/javascript">var Core = {     _ua : navigator.userAgent.toLowerCase(),    /** IE */    $ie : function(){return /msie/.test(this._ua)},    /** FireFox */    $moz : function(){return /gecko/.test(this._ua)},    /** Safari */    $safari : function(){return /webkit/.test(this._ua)},    addEvent : function(_el, func, evType, useCapture) {        if(_el == null){            alert("addEvent ÕÒ²»µœ¶ÔÏó£º" + _el);            return;        }        if (typeof useCapture == 'undefined') {            useCapture = false;        }        if (typeof evType == 'undefined') {            evType = 'click';        }        if (typeof func == 'undefined'){            func = function(){};        }        if (_el.addEventListener) {            _el.addEventListener(evType, func, useCapture);            return true;        }        else if (_el.attachEvent) {            var r = _el.attachEvent('on' + evType, func);            return true;        }        else {            _el['on' + evType] = func;        }    },        removeEvent : function (_el, fHandler, sName) {        if(_el == null){            return;        }        if (typeof fHandler != "function") {            return;        }        if (_el.addEventListener) {            _el.removeEventListener(sName, fHandler, false);        }        else if (_el.attachEvent) {            _el.detachEvent("on" + sName, fHandler);        }        fHandler[sName] = null;    },        cacheEvent:function(_el,sName){        if(_el == null){            return;        }        if (_el.addEventListener) {            return _el[sName];        }        else if (_el.attachEvent) {            return _el["on" + sName];        }    },        $ : function(id){        return document.getElementById(id);    },        setStyle : function (el, property, val) {        switch (property) {            case "opacity":                el.style.filter = "alpha(opacity=" + (val * 100) + ")";                if (!el.currentStyle || !el.currentStyle.hasLayout) {                    el.style.zoom = 1;                }                break;            default:                 el.style[property] = val;                break;        }    },        getPosition : function(el){        if(el.style.position == 'absolute'){            return {x : parseInt(el.style.left,10), y : parseInt(el.style.top,10)};        } else            return {x : el.offsetLeft,y : el.offsetTop};    },    setPosition : function(el,pos){        if(el.style.position == 'absolute'){            if(pos.x){                this.setStyle(el,'left',pos.x+'px');}            if(pos.y)                this.setStyle(el,'top',pos.y+'px');        } else {            if(pos.x)                el.offsetLeft = pos.x;            if(pos.y)                el.offsetTop = pos.y;        }    },    traceError : function(desc){        var newDiv = document.createElement('div');        newDiv.innerHTML = desc.toString();        this.$('trace').appendChild(newDiv);    }}for(var i = 2;i<6;i++){    Core.addEvent(Core.$('TM'+i+'X'),getin,'mousedown');}function getin(e){    var activeObjId = null;    var relLeft,relTop,relWidth;    var obj = e.target || e.srcElement;        activeObjId = obj.id;    Core.traceError('obj.id is '+activeObjId)        //obj.style.cursor = 'w-resize';    Core.setStyle(obj,'opacity','50');        var docMouseMove = Core.cacheEvent(document,'mousemove');    var docMouseUp = Core.cacheEvent(document,'mouseup');    Core.addEvent(document,f_move,'mousemove',false);    Core.addEvent(document,canelEvent,'mouseup',false);        function canelEvent(){        Core.removeEvent(document,f_move,'mousemove');        Core.removeEvent(document,canelEvent,'mouseup');        Core.addEvent(document,docMouseMove,'mousemove',false);        Core.addEvent(document,docMouseUp,'mouseup',false);    }        function f_mdown(obj,event){        Core.setStyle(obj,'position','absolute');        var preObj = obj.previousSibling;        if(preObj.nodeType != 1)            var preObj = preObj.previousSibling;        var nextObj = obj.nextSibling;        if(nextObj.nodeType != 1)            var nextObj = nextObj.nextSibling;        relLeft = event.clientX;        Core.traceError('mouse x is ' +relLeft);        relTop = event.clientY - Core.getPosition(obj).y;        relWidth = parseInt(preObj.style.width)+parseInt(nextObj.style.width);    };        f_mdown(obj,e);    function f_move(e){        var obj = Core.$(activeObjId);        var preObj = obj.previousSibling;        if(preObj.nodeType != 1)            var preObj = preObj.previousSibling;        var baseId = preObj.id.split('TM')[1];        var nextObj = obj.nextSibling;        if(nextObj.nodeType != 1)            var nextObj = nextObj.nextSibling;        if(obj != null){           var ss = e.clientX - relLeft;           var oldl = Core.getPosition(obj).x;           var oldtm1l = parseInt(preObj.style.left,10);           var oldtm1w = parseInt(preObj.style.width,10);             var oldtm2l = parseInt(nextObj.style.left,10);           var oldtm2w = parseInt(nextObj.style.width,10);           var currentl = e.clientX;           if (ss>0){                 if(oldl-oldtm1l-1<90){                    //Core.traceError('now mouse position is ' +e.clientX );                    //Core.setPosition(obj,{x:oldl});                    Core.setPosition(obj,{x:currentl});                    //Core.setStyle(preObj,'width',oldl + 'px');                    //Core.setPosition(nextObj,{x : oldl});                    //var tem_width = Core.getPosition(obj).x - Core.getPosition(preObj).x;                    var tem_width = currentl - oldtm1l;                    //Core.setStyle(preObj,'width',tem_width+'px');                    Core.setStyle(preObj,'width',tem_width + 'px');                    //Core.setPosition(nextObj,{x : oldl});                    Core.setPosition(nextObj,{x : currentl});                    //var tem_width = Core.getPosition(nextObj).x - oldl;                    tem_width = relWidth - tem_width;//relLeft                    Core.setStyle(nextObj,'width',tem_width + 'px');                    nextObj.innerHTML = parseInt((oldl - 10) / 2.5);                    if(Core.$('alarm'+baseId))                        Core.$('alarm'+baseId).value = nextObj.innerHTML;                }             }            else{//Core.traceError(relWidth);                 if(oldl-oldtm1l-1>10){                    //Core.setPosition(obj,{x:oldl});                    Core.setPosition(obj,{x:currentl});                   //var tem_width = Core.getPosition(obj).x - Core.getPosition(preObj).x;                   var tem_width = currentl - oldtm1l;                   Core.setStyle(preObj,'width',tem_width +'px');                   //Core.setPosition(nextObj,{x : oldl});                   Core.setPosition(nextObj,{x : currentl});                   //var tem_width = Core.getPosition(nextObj).x + parseInt(nextObj.style.width,10) - oldl;                   tem_width = relWidth-tem_width;                    Core.setStyle(nextObj,'width',tem_width+'px');                   nextObj.innerHTML = parseInt((oldl-10)/2.5);                   if(Core.$('alarm'+baseId))                        Core.$('alarm'+baseId).value = nextObj.innerHTML;                 }             }            }    }}//document.onmouseup = function(){alert("");//    for(var i = 2;i<6;i++){//        Core.setStyle(Core.$('TM'+i+'X'),'opacity','0');//        Core.removeEvent(Core.$('TM'+i+'X'),getin,'mousedown');//        Core.removeEvent(document,getin,'mousedown');//    }//    //}function releaseobj(){        currentMoveObj = null;        }/*function f_move1(obj){    //obj.style.cursor='w-resize';    var TM1=document.getElementById("TM1");      var TM2=document.getElementById("TM2");    var TM3=document.getElementById("TM3");               if(currentMoveObj != null)    {       var ss=event.x-relLeft;       var oldl=currentMoveObj.style.pixelLeft;       var oldtm1l=TM1.style.pixelLeft;       var oldtm1w=TM1.style.pixelWidth;         var oldtm2l=TM2.style.pixelLeft;       var oldtm2w=TM2.style.pixelWidth;               if (ss>0){                    if(oldl+1<100){currentMoveObj.style.pixelLeft=oldl+1;           TM1.style.pixelWidth=currentMoveObj.style.pixelLeft-TM1.style.pixelLeft;           TM2.style.pixelLeft=currentMoveObj.style.pixelLeft;            TM2.style.pixelWidth=TM3.style.pixelLeft-currentMoveObj.style.pixelLeft;            TM2.innerHTML=parseInt((currentMoveObj.style.pixelLeft-10)/2.5);           alarm1.value=TM2.innerHTML;         }         }        else{         if(oldl-1>10){currentMoveObj.style.pixelLeft=oldl-1;           TM1.style.pixelWidth=currentMoveObj.style.pixelLeft-TM1.style.pixelLeft;             TM2.style.pixelLeft=currentMoveObj.style.pixelLeft;            TM2.style.pixelWidth=TM3.style.pixelLeft-currentMoveObj.style.pixelLeft;           TM2.innerHTML=parseInt((currentMoveObj.style.pixelLeft-10)/2.5);           alarm1.value=TM2.innerHTML;         }         }        }}*/</script></body></html>

阅读全文(3143) | 回复(2) | 编辑 | 精华

 


回复:自己写的demo，鼠标来回拖拽，有待于优化，支持ff和ie
snowrose发表评论于2008/12/4 11:29:58

哦，sorry，这个其实是我自己的笔记，没有整理，回头整理下，惊扰大家了

个人主页 | 引用回复 | 主人回复 | 返回 | 编辑 | 删除

 


回复:自己写的demo，鼠标来回拖拽，有待于优化，支持ff和ie
Kinogam发表评论于2008/11/25 10:28:30

代码太混乱，html，css，js没分开来写，不推荐在HTML上直接写事件

 


» 1 »

发表评论：
昵称：
密码：
主页：
标题：
验证码：  (不区分大小写,请仔细填写,输错需重写评论内容！)

 
 



The Neurotic Fishbowl

.: 公告




Bloginess

«August 2025»
日一二三四五六
12
3456789
10111213141516
17181920212223
24252627282930
31

.: 我的分类(专题)

首页(130)
RIA(22)
linux(3)
J2EE(24)
the mood of everyday(58)
oral English(14)
database(2)
soap(3)
java(9)
web developer center(14)


In the Bowl

.: 最新日志

倾情奉献iphone、ipod、ipho
check ipad's rotatio
css position fixed d
field validation whe
常见浏览器cookie个数和大小限制说明
人类无法抗拒的10种心理，学会它，就能控
读as3cookbook 有感
flex builder linux s
Component returned f
use tramp in emacs i


.: 最新回复
replcica watches
replcica watches
Dell spikes game sit
回复:人类无法抗拒的10种心理，学会它，
回复:人类无法抗拒的10种心理，学会它，
回复:flex builder linu
回复:人类无法抗拒的10种心理，学会它，
回复:人类无法抗拒的10种心理，学会它，
回复:致女人------摘自读者
回复:虚心接受别人的意见，谨慎改正


The Fishkeeper
blog名称:up forever
日志总数:130
评论数量:274
留言数量:4
访问次数:1946595
建立时间:2006年5月25日



Text Me

.: 留言板

签写新留言

参观
这个界面很漂亮！
我试试吧
up forever
该换了！


Other Fish in the Sea

.: 链接


http://blogger.org.cn/blog/more.asp?name=hongrui&id=16955

邢红瑞 

http://niegc.cublog.cn/  聂国聪

http://www.blogjava.net/SteelHand/ 铁手剑谱

http://blog.sina.com.cn/qianqq 糖qq

http://blog.csdn.net/misty_wish   师弟

http://www.bbxy.net/xiaoyu/ Goteet老师

http://www.chinaitpower.com    中国it动力

http://jinyuxi.blog.sohu.com/ 靳羽西




lvetica, sans-serif; MARGIN: 0px 0px 8px; PADDING-BOTTOM: 0px; PADDING-LEFT: 0px; PADDING-RIGHT: 0px; PADDING-TOP: 0px } DIV.blogrollmain { FONT: 12px verdana, arial, helvetica, sans-serif } BLOCKQUOTE { COLOR: #202020; FONT: 11px verdana, arial, helvetica, sans-serif } .tinyfont { FONT: 9px verdana, arial, helvetica, sans-serif } TD { COLOR: #202020; FONT-FAMILY: verdana; FONT-SIZE: 12px } .title { COLOR: #996897; FONT-FAMILY: verdana, sans-serif; FONT-SIZE: 10pt; FONT-WEIGHT: bold } .titlefont { COLOR: #996897; FONT-FAMILY: verdana, sans-serif; FONT-SIZE: 14px; FONT-STYLE: italic } .titlefontarch { BORDER-BOTTOM: 1px solid; BORDER-LEFT: 1px solid; BORDER-RIGHT: 1px solid; BORDER-TOP: 1px solid; COLOR: #996897; FONT-FAMILY: verdana, sans-serif; FONT-SIZE: 14px; TEXT-ALIGN: center; WIDTH: 100% } .menu_text { COLOR: #c1ae94; FONT-FAMILY: Verdana, Arial, sans-serif; FONT-SIZE: 10px; MARGIN-BOTTOM: 1px } .links { FONT-FAMILY: Verdana, Arial, sans-serif; FONT-SIZE: 11px } .smallfont { COLOR: #202020; FONT-FAMILY: Verdana, Arial, sans-serif; FONT-SIZE: 11px; MARGIN: 0px } A:link { COLOR: #996897; TEXT-DECORATION: none } A:visited { COLOR: #996897; TEXT-DECORATION: none } A:hover { BACKGROUND-COLOR: #996897; COLOR: #610862; TEXT-DECORATION: underline } A { TEXT-DECORATION: none } .content { WIDTH: auto } .dateheader { MARGIN: 0px; PADDING-BOTTOM: 0px; PADDING-LEFT: 0px; PADDING-RIGHT: 0px; PADDING-TOP: 0px; POSITION: relative; WIDTH: auto; Z-INDEX: 3; min-width: 120px } .wbtn1 { BACKGROUND-COLOR: #ffffff; BORDER-BOTTOM: #996897 1px solid; BORDER-LEFT: #996897 1px solid; BORDER-RIGHT: #996897 1px solid; BORDER-TOP: #996897 1px solid; COLOR: #996897; FONT-FAMILY: verdana, arial geneva; FONT-SIZE: 7pt; TEXT-DECORATION: none } .calendar { PADDING-BOTTOM: 4px; PADDING-LEFT: 4px; PADDING-RIGHT: 4px; PADDING-TOP: 4px; TEXT-ALIGN: center } .calhead { BACKGROUND-COLOR: #ffffff; BORDER-BOTTOM: gray 1px solid; COLOR: black; TEXT-ALIGN: center; VERTICAL-ALIGN: middle; WIDTH: 14% } .calbody { BORDER-BOTTOM: 1px solid; TEXT-ALIGN: center; VERTICAL-ALIGN: middle; WIDTH: 14% } .style2 {color: #996897}
本站首页    管理页面    写新日志    退出

The Neurotic Fishbowl

[RIA]自己写的demo，鼠标来回拖拽，有待于优化，支持ff和ie
snowrose 发表于 2008/11/23 12:34:27

由于这个可恶的blog不支持firefox浏览器，所以图片不能上传，我实在受不了，决定用qq－zone写blog了　<html><head><meta http-equiv="Content-Type" content="text/html; charset=gb-2312"><title>Tsensor easy</title><style><!--td,div{ font-size: 9pt }--></style><script language="javascript">function aa(str){ alert("ÌáÊŸ:"+str); } function makedot(x,y,c,d1,d2){ //»­µãº¯Êý   document.write("<div style='height:"+d1+"px;position:absolute;z-index: 99;left:"+x+"px;top:"+y+"px;width:"+d2+"px;background:"+c+";overflow:hidden'></div>")  }  function makediv(x,y,c,d1,d2,s,id){ //»­divº¯Êý   document.write("<div id="+id+" style='border-style: solid; border-width: 1px;height:"+d1+"px;position:absolute;left:"+x+"px;top:"+y+"px;width:"+d2+"px;background:"+c+";overflow:hidden'>"+s+"</div>")  }  function makediv0(x,y,c,d1,d2,s,id){ //»­divº¯Êý   document.write("<div id="+id+" style='height:"+d1+"px;position:absolute;left:"+x+"px;top:"+y+"px;width:"+d2+"px;background:"+c+";overflow:hidden'>"+s+"</div>")  }  function line(x1,y1,x2,y2,c,d1,d2){   var slope=(y2-y1)/(x2-x1); //бÂÊ   var diff=x2-x1;   if(x1<x2){    for(var i=0;i<diff;i++){     makedot(x1+i,y1+slope*i,c,d1,d2);    }   }else if(x1>x2){    for(var i=0;i>diff;i--){     makedot(x1+i,y1+slope*i,c,d1,d2);    }   }else{ //»­Ž¹Ö±Ïß    var temp=y2-y1;    if(temp>0){     for(var i=0;i<temp;i++){      makedot(x1,y1+i,c,d1,d2);     }    }else{     for(var i=0;i>temp;i--){      makedot(x1,y1+i,c,d1,d2);     }    }   }  }  function temper(x,y,d,s){ line(x,y,x+d,y,'#D5AAAA',20,1); line(x+d,y,x+d*2,y,'#DFDFDF',20,1); line(x+d*2,y,x+d*3,y,'#DFC1DE',20,1); line(x+d*3,y,x+d*4,y,'#FF00FF',20,1); line(x+d*4,y,x+d*5,y,'#ee0000',20,1); line(x+s,y-5,x+s,y+20,'#0000ff',5,5); }function drawtemp3(x,y,s){var s2=s*2.5;s='<font color=#0000FF>'+s+'</font>'y+=17;line(x+s2-2,y-30,x+s2-2,y-12,'#0000ff',3,3); makediv0(x+s2,y-10,'#FFF',10,40,s);}//drawtemp3(10,30,60);</script><style>#TM1,#TM2,#TM3,#TM4,#TM5{    border-style: solid;    border-width: 1px;    position: absolute;    width: 50px;     height: 12px;    z-index: 2;    top: 15px;}#TM2X,#TM3X,#TM4X,#TM5X{    /*border-style: solid;    border-width: 1px;*/    position: absolute;    background-color: rgb(0, 255, 0);    width: 3px;     height: 12px;    z-index: 10;    top: 15px;}#TM2X:hover{    cursor : w-resize;}#trace{    color : red;    font-size : 14px;    background-color : #000;    width:600px;}</style></head><body><div style="left: 10px;background-color: #D5AAAA;position:absolute;width: 50px;height: 12px;z-index: 2;top: 15px;" id="TM1"></div><div style="left: 60px;position:absolute;cursor:w-resize;" id="TM2X"></div><div style="left: 60px; background-color: #DFDFDF;position:absolute;width: 50px;height: 12px;z-index: 2;top: 15px;" id="TM2">20</div><div style="left: 110px;position: absolute;cursor:w-resize;" id="TM3X"></div> <div style="left: 110px;background-color: #DFC1DE;position:absolute;width: 50px;height: 12px;z-index: 2;top: 15px;" id="TM3"> 40</div><div style="left: 160px;position: absolute;cursor:w-resize;" id="TM4X"></div> <div style="left: 160px;background-color:#FF00FF;position:absolute;width: 50px;height: 12px;z-index: 2;top: 15px;" id="TM4"> 60</div><div style="left: 210px;position: absolute;cursor:w-resize;" id="TM5X"></div>  <div style="left: 210px;background-color:#EE0000;position:absolute;width: 50px;height: 12px;z-index: 2;top: 15px;" id="TM5"> 80</div><p><br>¡¡</p><div style="position: absolute; width: 265px; height: 13px; z-index: 13; left: 9px; top: 32px;" id="layer1">  <table id="table1" border="0" cellpadding="0" cellspacing="0" width="265"><tbody><tr>    <td id="lcell6" style="font-size: 9pt;">0    </td>    <td id="lcell7" style="font-size: 9pt;">¡¡</td>    <td id="lcell8" style="font-size: 9pt;">¡¡</td>    <td id="lcell9" style="font-size: 9pt;">¡¡</td>    <td id="lcell10" style="font-size: 9pt;">    <p align="right">100</p></td>  </tr></tbody></table>   </div> <div style="position: absolute; width: 9px; height: 14px; z-index: 100; left: 10px; top: 51px;" id="layer3">   <input value="M" name="cancel0" style="border-style: solid; border-width: 1px; padding: 1px 1px 2px; width: 17px; color: rgb(0, 128, 128); background-color: rgb(223, 223, 223); height: 17px;" onclick="if(document.getElementById('layer4').style.display=='none'){                      document.getElementById('layer4').style.display='';                      }else{                       document.getElementById('layer4').style.display='none';}                       " type="button"></div><div style="display: none; position: absolute; width: 215px; height: 27px; z-index: 101; left: 45px; top: 46px;" id="layer4"><table style="border-collapse: collapse;" id="table2" border="0" cellpadding="0" width="214">  <tbody><tr>     <td style="font-size: 9pt;" align="center" height="26" width="29">     <input readonly="true" id="alarm1" size="6" style="border-style: solid; border-width: 1px; height: 18px; background-color: rgb(213, 170, 170); padding-top: 1px;" value="20" type="text"></td>         <td style="font-size: 9pt;" align="center" height="26" width="24">     <input readonly="true" id="alarm2" size="6" style="border-style: solid; border-width: 1px; height: 18px; background-color: rgb(223, 223, 223); padding-top: 1px;" value="40" type="text"></td>         <td style="font-size: 9pt;" align="center" height="26" width="29">     <input readonly="true" id="alarm3" size="6" style="border-style: solid; border-width: 1px; height: 18px; background-color: rgb(223, 193, 222); padding-top: 1px;" value="60" type="text"></td>         <td style="font-size: 9pt;" align="center" height="26" width="21">     <input readonly="true" id="alarm4" size="6" style="border-style: solid; border-width: 1px; height: 18px; background-color: rgb(255, 0, 255); padding-top: 1px;" value="80" type="text"></td>    <td style="font-size: 9pt;" align="center" height="26" width="6"> ¡¡</td>    <td style="font-size: 9pt;" height="26" width="108">     <p align="center">    <input value="Save" id="save" style="border: 1px solid rgb(0, 128, 128); padding: 1px 2px; width: 35px; color: rgb(0, 128, 128); background-color: rgb(223, 223, 223); height: 17px;" type="submit">    <input value="Cancel" id="cancel" style="border: 1px solid rgb(0, 128, 128); padding: 1px 2px; width: 46px; color: rgb(0, 128, 128); background-color: rgb(223, 223, 223); height: 17px;" onclick="location.reload();" type="button"></p></td>  </tr>  </tbody></table>  </div><script>curvalue=52.5;drawtemp3(10,25,curvalue);</script><div style="background: rgb(0, 0, 255) none repeat scroll 0%; overflow: hidden; height: 3px; position: absolute; z-index: 99; left: 139.25px; top: 12px; width: 3px; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"></div><div style="background: rgb(0, 0, 255) none repeat scroll 0%; overflow: hidden; height: 3px; position: absolute; z-index: 99; left: 139.25px; top: 13px; width: 3px; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"></div><div style="background: rgb(0, 0, 255) none repeat scroll 0%; overflow: hidden; height: 3px; position: absolute; z-index: 99; left: 139.25px; top: 14px; width: 3px; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"></div><div style="background: rgb(0, 0, 255) none repeat scroll 0%; overflow: hidden; height: 3px; position: absolute; z-index: 99; left: 139.25px; top: 15px; width: 3px; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"></div><div style="background: rgb(0, 0, 255) none repeat scroll 0%; overflow: hidden; height: 3px; position: absolute; z-index: 99; left: 139.25px; top: 16px; width: 3px; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"></div><div style="background: rgb(0, 0, 255) none repeat scroll 0%; overflow: hidden; height: 3px; position: absolute; z-index: 99; left: 139.25px; top: 17px; width: 3px; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"></div><div style="background: rgb(0, 0, 255) none repeat scroll 0%; overflow: hidden; height: 3px; position: absolute; z-index: 99; left: 139.25px; top: 18px; width: 3px; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"></div><div style="background: rgb(0, 0, 255) none repeat scroll 0%; overflow: hidden; height: 3px; position: absolute; z-index: 99; left: 139.25px; top: 19px; width: 3px; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"></div><div style="background: rgb(0, 0, 255) none repeat scroll 0%; overflow: hidden; height: 3px; position: absolute; z-index: 99; left: 139.25px; top: 20px; width: 3px; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"></div><div style="background: rgb(0, 0, 255) none repeat scroll 0%; overflow: hidden; height: 3px; position: absolute; z-index: 99; left: 139.25px; top: 21px; width: 3px; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"></div><div style="background: rgb(0, 0, 255) none repeat scroll 0%; overflow: hidden; height: 3px; position: absolute; z-index: 99; left: 139.25px; top: 22px; width: 3px; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"></div><div style="background: rgb(0, 0, 255) none repeat scroll 0%; overflow: hidden; height: 3px; position: absolute; z-index: 99; left: 139.25px; top: 23px; width: 3px; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"></div><div style="background: rgb(0, 0, 255) none repeat scroll 0%; overflow: hidden; height: 3px; position: absolute; z-index: 99; left: 139.25px; top: 24px; width: 3px; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"></div><div style="background: rgb(0, 0, 255) none repeat scroll 0%; overflow: hidden; height: 3px; position: absolute; z-index: 99; left: 139.25px; top: 25px; width: 3px; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"></div><div style="background: rgb(0, 0, 255) none repeat scroll 0%; overflow: hidden; height: 3px; position: absolute; z-index: 99; left: 139.25px; top: 26px; width: 3px; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"></div><div style="background: rgb(0, 0, 255) none repeat scroll 0%; overflow: hidden; height: 3px; position: absolute; z-index: 99; left: 139.25px; top: 27px; width: 3px; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"></div><div style="background: rgb(0, 0, 255) none repeat scroll 0%; overflow: hidden; height: 3px; position: absolute; z-index: 99; left: 139.25px; top: 28px; width: 3px; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"></div><div style="background: rgb(0, 0, 255) none repeat scroll 0%; overflow: hidden; height: 3px; position: absolute; z-index: 99; left: 139.25px; top: 29px; width: 3px; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"></div><div id="undefined" style="background: rgb(255, 255, 255) none repeat scroll 0%; overflow: hidden; height: 10px; position: absolute; left: 141.25px; top: 32px; width: 40px; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"><font color="#0000ff">52.5</font></div><div id="trace"></div><script type="text/javascript">var Core = {     _ua : navigator.userAgent.toLowerCase(),    /** IE */    $ie : function(){return /msie/.test(this._ua)},    /** FireFox */    $moz : function(){return /gecko/.test(this._ua)},    /** Safari */    $safari : function(){return /webkit/.test(this._ua)},    addEvent : function(_el, func, evType, useCapture) {        if(_el == null){            alert("addEvent ÕÒ²»µœ¶ÔÏó£º" + _el);            return;        }        if (typeof useCapture == 'undefined') {            useCapture = false;        }        if (typeof evType == 'undefined') {            evType = 'click';        }        if (typeof func == 'undefined'){            func = function(){};        }        if (_el.addEventListener) {            _el.addEventListener(evType, func, useCapture);            return true;        }        else if (_el.attachEvent) {            var r = _el.attachEvent('on' + evType, func);            return true;        }        else {            _el['on' + evType] = func;        }    },        removeEvent : function (_el, fHandler, sName) {        if(_el == null){            return;        }        if (typeof fHandler != "function") {            return;        }        if (_el.addEventListener) {            _el.removeEventListener(sName, fHandler, false);        }        else if (_el.attachEvent) {            _el.detachEvent("on" + sName, fHandler);        }        fHandler[sName] = null;    },        cacheEvent:function(_el,sName){        if(_el == null){            return;        }        if (_el.addEventListener) {            return _el[sName];        }        else if (_el.attachEvent) {            return _el["on" + sName];        }    },        $ : function(id){        return document.getElementById(id);    },        setStyle : function (el, property, val) {        switch (property) {            case "opacity":                el.style.filter = "alpha(opacity=" + (val * 100) + ")";                if (!el.currentStyle || !el.currentStyle.hasLayout) {                    el.style.zoom = 1;                }                break;            default:                 el.style[property] = val;                break;        }    },        getPosition : function(el){        if(el.style.position == 'absolute'){            return {x : parseInt(el.style.left,10), y : parseInt(el.style.top,10)};        } else            return {x : el.offsetLeft,y : el.offsetTop};    },    setPosition : function(el,pos){        if(el.style.position == 'absolute'){            if(pos.x){                this.setStyle(el,'left',pos.x+'px');}            if(pos.y)                this.setStyle(el,'top',pos.y+'px');        } else {            if(pos.x)                el.offsetLeft = pos.x;            if(pos.y)                el.offsetTop = pos.y;        }    },    traceError : function(desc){        var newDiv = document.createElement('div');        newDiv.innerHTML = desc.toString();        this.$('trace').appendChild(newDiv);    }}for(var i = 2;i<6;i++){    Core.addEvent(Core.$('TM'+i+'X'),getin,'mousedown');}function getin(e){    var activeObjId = null;    var relLeft,relTop,relWidth;    var obj = e.target || e.srcElement;        activeObjId = obj.id;    Core.traceError('obj.id is '+activeObjId)        //obj.style.cursor = 'w-resize';    Core.setStyle(obj,'opacity','50');        var docMouseMove = Core.cacheEvent(document,'mousemove');    var docMouseUp = Core.cacheEvent(document,'mouseup');    Core.addEvent(document,f_move,'mousemove',false);    Core.addEvent(document,canelEvent,'mouseup',false);        function canelEvent(){        Core.removeEvent(document,f_move,'mousemove');        Core.removeEvent(document,canelEvent,'mouseup');        Core.addEvent(document,docMouseMove,'mousemove',false);        Core.addEvent(document,docMouseUp,'mouseup',false);    }        function f_mdown(obj,event){        Core.setStyle(obj,'position','absolute');        var preObj = obj.previousSibling;        if(preObj.nodeType != 1)            var preObj = preObj.previousSibling;        var nextObj = obj.nextSibling;        if(nextObj.nodeType != 1)            var nextObj = nextObj.nextSibling;        relLeft = event.clientX;        Core.traceError('mouse x is ' +relLeft);        relTop = event.clientY - Core.getPosition(obj).y;        relWidth = parseInt(preObj.style.width)+parseInt(nextObj.style.width);    };        f_mdown(obj,e);    function f_move(e){        var obj = Core.$(activeObjId);        var preObj = obj.previousSibling;        if(preObj.nodeType != 1)            var preObj = preObj.previousSibling;        var baseId = preObj.id.split('TM')[1];        var nextObj = obj.nextSibling;        if(nextObj.nodeType != 1)            var nextObj = nextObj.nextSibling;        if(obj != null){           var ss = e.clientX - relLeft;           var oldl = Core.getPosition(obj).x;           var oldtm1l = parseInt(preObj.style.left,10);           var oldtm1w = parseInt(preObj.style.width,10);             var oldtm2l = parseInt(nextObj.style.left,10);           var oldtm2w = parseInt(nextObj.style.width,10);           var currentl = e.clientX;           if (ss>0){                 if(oldl-oldtm1l-1<90){                    //Core.traceError('now mouse position is ' +e.clientX );                    //Core.setPosition(obj,{x:oldl});                    Core.setPosition(obj,{x:currentl});                    //Core.setStyle(preObj,'width',oldl + 'px');                    //Core.setPosition(nextObj,{x : oldl});                    //var tem_width = Core.getPosition(obj).x - Core.getPosition(preObj).x;                    var tem_width = currentl - oldtm1l;                    //Core.setStyle(preObj,'width',tem_width+'px');                    Core.setStyle(preObj,'width',tem_width + 'px');                    //Core.setPosition(nextObj,{x : oldl});                    Core.setPosition(nextObj,{x : currentl});                    //var tem_width = Core.getPosition(nextObj).x - oldl;                    tem_width = relWidth - tem_width;//relLeft                    Core.setStyle(nextObj,'width',tem_width + 'px');                    nextObj.innerHTML = parseInt((oldl - 10) / 2.5);                    if(Core.$('alarm'+baseId))                        Core.$('alarm'+baseId).value = nextObj.innerHTML;                }             }            else{//Core.traceError(relWidth);                 if(oldl-oldtm1l-1>10){                    //Core.setPosition(obj,{x:oldl});                    Core.setPosition(obj,{x:currentl});                   //var tem_width = Core.getPosition(obj).x - Core.getPosition(preObj).x;                   var tem_width = currentl - oldtm1l;                   Core.setStyle(preObj,'width',tem_width +'px');                   //Core.setPosition(nextObj,{x : oldl});                   Core.setPosition(nextObj,{x : currentl});                   //var tem_width = Core.getPosition(nextObj).x + parseInt(nextObj.style.width,10) - oldl;                   tem_width = relWidth-tem_width;                    Core.setStyle(nextObj,'width',tem_width+'px');                   nextObj.innerHTML = parseInt((oldl-10)/2.5);                   if(Core.$('alarm'+baseId))                        Core.$('alarm'+baseId).value = nextObj.innerHTML;                 }             }            }    }}//document.onmouseup = function(){alert("");//    for(var i = 2;i<6;i++){//        Core.setStyle(Core.$('TM'+i+'X'),'opacity','0');//        Core.removeEvent(Core.$('TM'+i+'X'),getin,'mousedown');//        Core.removeEvent(document,getin,'mousedown');//    }//    //}function releaseobj(){        currentMoveObj = null;        }/*function f_move1(obj){    //obj.style.cursor='w-resize';    var TM1=document.getElementById("TM1");      var TM2=document.getElementById("TM2");    var TM3=document.getElementById("TM3");               if(currentMoveObj != null)    {       var ss=event.x-relLeft;       var oldl=currentMoveObj.style.pixelLeft;       var oldtm1l=TM1.style.pixelLeft;       var oldtm1w=TM1.style.pixelWidth;         var oldtm2l=TM2.style.pixelLeft;       var oldtm2w=TM2.style.pixelWidth;               if (ss>0){                    if(oldl+1<100){currentMoveObj.style.pixelLeft=oldl+1;           TM1.style.pixelWidth=currentMoveObj.style.pixelLeft-TM1.style.pixelLeft;           TM2.style.pixelLeft=currentMoveObj.style.pixelLeft;            TM2.style.pixelWidth=TM3.style.pixelLeft-currentMoveObj.style.pixelLeft;            TM2.innerHTML=parseInt((currentMoveObj.style.pixelLeft-10)/2.5);           alarm1.value=TM2.innerHTML;         }         }        else{         if(oldl-1>10){currentMoveObj.style.pixelLeft=oldl-1;           TM1.style.pixelWidth=currentMoveObj.style.pixelLeft-TM1.style.pixelLeft;             TM2.style.pixelLeft=currentMoveObj.style.pixelLeft;            TM2.style.pixelWidth=TM3.style.pixelLeft-currentMoveObj.style.pixelLeft;           TM2.innerHTML=parseInt((currentMoveObj.style.pixelLeft-10)/2.5);           alarm1.value=TM2.innerHTML;         }         }        }}*/</script></body></html>

阅读全文(3143) | 回复(2) | 编辑 | 精华

 


回复:自己写的demo，鼠标来回拖拽，有待于优化，支持ff和ie
snowrose发表评论于2008/12/4 11:29:58

哦，sorry，这个其实是我自己的笔记，没有整理，回头整理下，惊扰大家了

个人主页 | 引用回复 | 主人回复 | 返回 | 编辑 | 删除

 


回复:自己写的demo，鼠标来回拖拽，有待于优化，支持ff和ie
Kinogam发表评论于2008/11/25 10:28:30

代码太混乱，html，css，js没分开来写，不推荐在HTML上直接写事件

 


» 1 »

发表评论：
昵称：
密码：
主页：
标题：
验证码：  (不区分大小写,请仔细填写,输错需重写评论内容！)

 
 



The Neurotic Fishbowl

.: 公告




Bloginess

«August 2025»
日一二三四五六
12
3456789
10111213141516
17181920212223
24252627282930
31

.: 我的分类(专题)

首页(130)
RIA(22)
linux(3)
J2EE(24)
the mood of everyday(58)
oral English(14)
database(2)
soap(3)
java(9)
web developer center(14)


In the Bowl

.: 最新日志

倾情奉献iphone、ipod、ipho
check ipad's rotatio
css position fixed d
field validation whe
常见浏览器cookie个数和大小限制说明
人类无法抗拒的10种心理，学会它，就能控
读as3cookbook 有感
flex builder linux s
Component returned f
use tramp in emacs i


.: 最新回复
replcica watches
replcica watches
Dell spikes game sit
回复:人类无法抗拒的10种心理，学会它，
回复:人类无法抗拒的10种心理，学会它，
回复:flex builder linu
回复:人类无法抗拒的10种心理，学会它，
回复:人类无法抗拒的10种心理，学会它，
回复:致女人------摘自读者
回复:虚心接受别人的意见，谨慎改正


The Fishkeeper
blog名称:up forever
日志总数:130
评论数量:274
留言数量:4
访问次数:1946595
建立时间:2006年5月25日



Text Me

.: 留言板

签写新留言

参观
这个界面很漂亮！
我试试吧
up forever
该换了！


Other Fish in the Sea

.: 链接


http://blogger.org.cn/blog/more.asp?name=hongrui&id=16955

邢红瑞 

http://niegc.cublog.cn/  聂国聪

http://www.blogjava.net/SteelHand/ 铁手剑谱

http://blog.sina.com.cn/qianqq 糖qq

http://blog.csdn.net/misty_wish   师弟

http://www.bbxy.net/xiaoyu/ Goteet老师

http://www.chinaitpower.com    中国it动力

http://jinyuxi.blog.sohu.com/ 靳羽西




站点首页 | 联系我们 | 博客注册 | 博客登陆

Sponsored By W3CHINA
W3CHINA Blog 0.8 Processed in 0.080 second(s), page refreshed 144767018 times.
《全国人大常委会关于维护互联网安全的决定》  《计算机信息网络国际联网安全保护管理办法》
苏ICP备05006046号