Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 4 of 4
  1. #1
    Regular Coder
    Join Date
    Jun 2002
    Location
    Adirondacks
    Posts
    516
    Thanks
    4
    Thanked 4 Times in 4 Posts

    using toolman's drag script

    See this page please
    http://tool-man.org/examples/edit-in-place.html

    I want to use example 3 or 4 under sortable editable lists.

    I downloaded the js files and such.
    I tried to snip out the rest of the code and that doesn't work.

    Can someone help please? This seems real simple but apparently I'm missing something.

    BTW I did email the writer of that but got no reply. It does seem to be a dated page but....it's exactly what I want.

  • #2
    Senior Coder
    Join Date
    Mar 2005
    Location
    Portsmouth UK
    Posts
    4,511
    Thanks
    3
    Thanked 504 Times in 491 Posts
    dont like messing with that script but playing with something simlar

    could possible modify to your requirement


    Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
        "http://www.w3.org/TR/html4/loose.dtd">
    
    <html>
    
    <head>
      <title></title>
    
    <style type="text/css">
    <!--
    .cls0 {
     width:100px;height:20px;background-Color:#989898;border-Left:solid black 1px;border-Bottom:solid black 1px;padding-Left:5px;
    }
    .cls1 {
     height:20px;background-Color:#FFFFCC;border-Left:solid black 1px;border-Bottom:solid black 1px;padding-Left:5px;
    }
    
    .cls2 {
     height:20px;background-Color:#CCFFFF;border-Left:solid black 1px;border-Bottom:solid black 1px;padding-Left:5px;
    }
    
    
    -->
    </style>
    <script language="JavaScript" type="text/javascript">
    <!--
    // Scoll List (05-02-2007) Draft
    // by Vic Phillips http://www.vicsjavascripts.org.uk
    
    
    var zxcRowAry=[];
    zxcRowAry[0]=[['title 1','cls0','Sort Alpha','SortAlpha'],['title 1','cls0','Sort Numeric','SortNumeric'],['title 1','cls0','Optional Title']];
    zxcRowAry[1]='DragDrop';
    zxcRowAry[2]=[['A-Row 0A','cls1'],['aRow 0B','cls2'],['Row 0B','cls1']];
    zxcRowAry[3]=[['B-Row 1A','cls1'],['bRow 1B','cls2'],['Row 1B','cls2']];
    zxcRowAry[4]=[['C-Row 2A','cls1'],['cRow 2B','cls2'],['Row 2B','cls1']];
    zxcRowAry[5]=[['D-Row 3A','cls1'],['Row 3B','cls2'],['Row 3B','cls2']];
    zxcRowAry[6]=[['F-Row 4A','cls1'],['Row 4B','cls2'],['Row 4B','cls1']];
    zxcRowAry[7]=[['G-Row 5A','cls1'],['Row 5B','cls2'],['Row 5B','cls2']];
    zxcRowAry[8]=[['H-Row 6A','cls1'],['Row 6B','cls2'],['Row 6B','cls1']];
    zxcRowAry[9]=[['I-Row 7A','cls1'],['Row 7B','cls2'],['Row 7B','cls2']];
    zxcRowAry[10]=[['J-Row 8A','cls1'],['Row 8B','cls2'],['Row 8B','cls1']];
    zxcRowAry[11]=[['K-Row 9A','cls1'],['Row 9B','cls2'],['Row 9B','cls2']];
    zxcRowAry[12]=[['L-Row 10A','cls1'],['Row 10B','cls2'],['Row 10B','cls1']];
    
    function zxcInitList(zxcid,zxcary){
     var zxcp=document.getElementById(zxcid);
     var zxchdr=zxcS('DIV',{position:'absolute',overflow:'hidden',zIndex:'1',left:'0px',top:'0px',width:(parseInt(zxcp.style.width)-20)+'px',border:'0px'},zxcp);
     zxchdr.className=zxcary[0][0][1];
     var zxclst=zxcS(zxcp.cloneNode(false),{position:'relative',overflow:'scroll',border:'0px'},zxcp);
     zxclst.onscroll=function(){ zxcScrollCk(this,zxchdrin); }
     var zxchdrin=zxcS('DIV',{position:'absolute',left:'0px',top:'0px',width:(parseInt(zxcp.style.width)-20)+'px'},zxchdr);
     for (var zxc0=0;zxc0<zxcary[0].length;zxc0++){
      var zxcd=zxcS('DIV',{position:'absolute',left:((zxc0>0)?zxcd.offsetLeft+zxcd.offsetWidth:0)+'px',top:'0px'},zxchdrin,zxcary[0][zxc0][0]);
      zxcd.className=zxcary[0][zxc0][1];
      zxcd.title=zxcary[0][zxc0][2]||null;
      if (zxcary[0][zxc0][3]){
       zxcd.fun=zxcary[0][zxc0][3];
       zxcd.nu=zxc0;
       zxcd.ud=true;
       zxcS(zxcd,{cursor:(document.all)?'hand':'pointer'});
       zxcd.onmouseup=function(){ zxcSort(this,zxclst,true); }
      }
     }
     zxcS(zxchdr,{height:zxcd.offsetHeight+'px'});
     var zxclstin=zxcS('DIV',{position:'relative',left:'0px',top:'0px'},zxclst);
     if (window['zxc'+zxcary[1]]){ zxcS(zxclstin,{cursor:'n-resize'}); zxclstin.onmousedown=function(){ window['zxc'+zxcary[1]](); } }
     zxcS(zxchdr.cloneNode(false),{position:'relative'},zxclstin);
     for (var zxc1=2;zxc1<zxcary.length;zxc1++){
      var zxcrow=zxcS('DIV',{position:'relative'},zxclstin);
      for (var zxc1a=0;zxc1a<zxchdrin.childNodes.length;zxc1a++){
       var zxcd=zxcS('DIV',{position:'absolute',left:(zxchdrin.childNodes[zxc1a].offsetLeft)+'px',width:(zxchdrin.childNodes[zxc1a].offsetWidth)+'px',top:'0px'},zxcrow,zxcary[zxc1][zxc1a][0]);
       zxcd.className=zxcary[zxc1][zxc1a][1];
      }
      zxcS(zxcrow,{overflow:'hidden',width:(zxcd.offsetLeft+zxcd.offsetWidth)+'px',height:zxcrow.firstChild.offsetHeight+'px'});
     }
    }
    
    function zxcScrollCk(zxcobj,zxchdrin){
     zxcS(zxchdrin,{left:-zxcobj.scrollLeft+'px'});
    }
    
    var zxcObj;
    
    function zxcDragDrop(){
     var zxcevt=window.event||arguments.callee.caller.arguments[0];
     var zxcp=zxcEventObj(zxcevt).parentNode;
     var zxcpp=zxcp.parentNode;
     zxcObj=null;
     if (zxcpp.childNodes.length<4||zxcp.style.overflow!='hidden'){ return; }
     zxcobj=zxcS(zxcEventObj(zxcevt).parentNode.cloneNode(true),{position:'absolute',zIndex:'10',top:zxcp.offsetTop+'px'},zxcpp.parentNode);
     zxcMseDown(zxcobj,zxcp,zxcMse(zxcevt));
    }
    
    function zxcMseDown(zxcobj,zxcp,zxcy){
     document.onmousemove=function(event){zxcDrag(event);}
     document.onmouseup=function(event){zxcMseUp(event);}
     document.onselectstart=function(event){window.event.returnValue=false; }
     zxcObj=[zxcobj,zxcobj.offsetTop,zxcy,zxcp];
     zxcDragY=zxcMse(event)-zxcObj.offsetTop;
    }
    
    function zxcMseUp(event){
     if (!zxcObj){ return; }
     document.onmouseup=null;
     document.onmousemove=null;
     document.onselectstart=null;
     var zxcclds=zxcObj[3].parentNode.childNodes;
     if (zxcObj[0].offsetTop>5||zxcObj[0].offsetTop<zxcObj[0].parentNode.offsetHeight){
      for (var zxc0=0;zxc0<zxcclds.length;zxc0++){
       if (zxcclds[zxc0].offsetTop>zxcObj[0].offsetTop){
        zxcS(zxcObj[0],{position:'relative',top:'0px'});
        zxcObj[3].parentNode.insertBefore(zxcObj[0],zxcclds[zxc0]);
        zxcObj[3].parentNode.removeChild(zxcObj[3]);
        zxcObj=null;
        return;
       }
      }
     }
     zxcObj[0].parentNode.removeChild(zxcObj[0]);
     zxcObj=null;
    }
    
    function zxcDrag(event) {
     zxcObj[0].style.top=(zxcObj[1]+zxcMse(event)-zxcObj[2])+'px';
    }
    
    function zxcMse(event){
     if(!event) var event=window.event;
     if (document.all){ return event.clientY; }
     return event.pageY;
    }
    
    function zxcEventObj(zxce){
     if (!zxce) var zxce=window.event;
     zxce.cancelBubble=true;
     if (zxce.stopPropagation) zxce.stopPropagation();
     if (zxce.target) zxceobj=zxce.target;
     else if (zxce.srcElement) zxceobj=zxce.srcElement;
     if (zxceobj.nodeType==3) zxceobj=zxceobj.parentNode;
     return zxceobj;
    }
    
    function zxcEventAdd(zxco,zxct,zxcf) {
     if ( zxco.addEventListener ){ zxco.addEventListener(zxct, function(e){ zxco[zxcf](e);}, false); }
     else if ( zxco.attachEvent ){ zxco.attachEvent('on'+zxct,function(e){ zxco[zxcf](e); }); }
     else {
      var zxcPrev=zxco["on" + zxct];
      if (zxcPrev){ zxco['on'+zxct]=function(e){ zxcPrev(e); zxco[zxcf](e); }; }
      else { zxco['on'+zxct]=zxco[zxcf]; }
     }
    }
    
    var zxcEvt=0;
    
    function zxcAddEvt(zxc,zxcfun,zxcevt){
     zxc['zxcaddEvt'+zxcEvt]=window[zxcfun];
     zxcEventAdd(zxc,zxcevt,'zxcaddEvt'+zxcEvt);
     zxcEvt++;
    }
    
    var zxcSortCol;
    
    function zxcSort(zxcobj,zxclst,zxcud){
     zxcSortCol=zxcobj.nu;
     var zxcrows=zxclst.firstChild.childNodes;
     var zxcary=[];
     for (var zxc1=1;zxc1<zxcrows.length;zxc1++){
      zxcary.push(zxcrows[zxc1].cloneNode(true));
     }
     zxcary=zxcary.sort(window['zxc'+zxcobj.fun]);
     if (zxcobj.ud){ zxcary=zxcary.reverse(); }
     for (var zxc2=0;zxc2<zxcary.length;zxc2++){
      zxcrows[zxc2+1].parentNode.replaceChild(zxcary[zxc2],zxcrows[zxc2+1]);
     }
     zxcobj.ud=!zxcobj.ud;
    }
    
    function zxcSortAlpha(zxca,zxcb){
     var zxcaa=zxca.childNodes[zxcSortCol].firstChild.data;
     var zxcbb=zxcb.childNodes[zxcSortCol].firstChild.data;
     if (zxcaa<zxcbb) return -1;
     if (zxcaa>zxcbb) return 1;
     return 0;
    }
    
    function zxcSortNumeric(zxca,zxcb){
     var zxcaa=zxca.childNodes[zxcSortCol].firstChild.data.replace(/\D/g,'');
     var zxcbb=zxcb.childNodes[zxcSortCol].firstChild.data.replace(/\D/g,''); ;
     if (zxcaa<zxcbb) return -1;
     if (zxcaa>zxcbb) return 1;
     return 0;
    }
    
    function zxcS(zxcele,zxcstyle,zxcp,zxctxt){
     if (typeof(zxcele)=='string'){ zxcele=document.createElement(zxcele); }
     for (key in zxcstyle){ zxcele.style[key]=zxcstyle[key]; }
     if (zxcp){ zxcp.appendChild(zxcele); }
     if (zxctxt){ zxcele.appendChild(document.createTextNode(zxctxt)); }
     return zxcele;
    }
    
    
    
    //-->
    </script>
    
    </head>
    
    <body onload="zxcInitList('Tst1',zxcRowAry);">
    
    <div id="Tst1" style="position:relative;width:300px;height:200px;border:solid black 1px;" >
    </div>
    
    </body>
    
    </html>
    Vic

    God Loves You and will never love you less.

    http://www.vicsjavascripts.org/Home.htm

    If my post has been useful please donate to http://www.operationsmile.org.uk/

  • #3
    Regular Coder
    Join Date
    Jun 2002
    Location
    Adirondacks
    Posts
    516
    Thanks
    4
    Thanked 4 Times in 4 Posts
    thank you for the reply.
    You were nice enough to post that code another time. I absolutely plan to use it in another project. However, this is different. I like the list being draggable/sortable and the ability to edit "in-line" too.
    I post a top 4-500 players on my site and people will often change it to their own order. Once they get near the end they may completely disagree that playerX even belongs on the list so this way they can just edit his name right out. That one is just so perfect for what I want to do.

    Thank you though

  • #4
    Senior Coder
    Join Date
    Mar 2005
    Location
    Portsmouth UK
    Posts
    4,511
    Thanks
    3
    Thanked 504 Times in 491 Posts
    hmm

    got me going now
    added the editable bit
    Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
        "http://www.w3.org/TR/html4/loose.dtd">
    
    <html>
    
    <head>
      <title></title>
    
    <style type="text/css">
    <!--
    .cls0 {
     width:100px;height:20px;background-Color:#989898;border-Left:solid black 1px;border-Bottom:solid black 1px;padding-Left:5px;
    }
    .cls1 {
     height:20px;background-Color:#FFFFCC;border-Left:solid black 1px;border-Bottom:solid black 1px;padding-Left:5px;
    }
    
    .cls2 {
     height:20px;background-Color:#CCFFFF;border-Left:solid black 1px;border-Bottom:solid black 1px;padding-Left:5px;
    }
    
    
    -->
    </style>
    <script language="JavaScript" type="text/javascript">
    <!--
    // Scoll List (05-02-2007) Draft
    // by Vic Phillips http://www.vicsjavascripts.org.uk
    
    
    var zxcRowAry=[];
    zxcRowAry[0]=[['title 1','cls0','Sort Alpha','SortAlpha'],['title 1','cls0','Sort Numeric','SortNumeric'],['title 1','cls0','Optional Title']];
    zxcRowAry[1]='DragDrop';
    zxcRowAry[2]=[['A-Row 0A','cls1'],['aRow 0B','cls2'],['Row 0B','cls1']];
    zxcRowAry[3]=[['B-Row 1A','cls1'],['bRow 1B','cls2'],['Row 1B','cls2']];
    zxcRowAry[4]=[['C-Row 2A','cls1'],['cRow 2B','cls2'],['Row 2B','cls1']];
    zxcRowAry[5]=[['D-Row 3A','cls1'],['Row 3B','cls2'],['Row 3B','cls2']];
    zxcRowAry[6]=[['F-Row 4A','cls1'],['Row 4B','cls2'],['Row 4B','cls1']];
    zxcRowAry[7]=[['G-Row 5A','cls1'],['Row 5B','cls2'],['Row 5B','cls2']];
    zxcRowAry[8]=[['H-Row 6A','cls1'],['Row 6B','cls2'],['Row 6B','cls1']];
    zxcRowAry[9]=[['I-Row 7A','cls1'],['Row 7B','cls2'],['Row 7B','cls2']];
    zxcRowAry[10]=[['J-Row 8A','cls1'],['Row 8B','cls2'],['Row 8B','cls1']];
    zxcRowAry[11]=[['K-Row 9A','cls1'],['Row 9B','cls2'],['Row 9B','cls2']];
    zxcRowAry[12]=[['L-Row 10A','cls1'],['Row 10B','cls2'],['Row 10B','cls1']];
    
    function zxcInitList(zxcid,zxcary){
     var zxcp=document.getElementById(zxcid);
     var zxchdr=zxcS('DIV',{position:'absolute',overflow:'hidden',zIndex:'1',left:'0px',top:'0px',width:(parseInt(zxcp.style.width)-20)+'px',border:'0px'},zxcp);
     zxchdr.className=zxcary[0][0][1];
     var zxclst=zxcS(zxcp.cloneNode(false),{position:'relative',overflow:'scroll',border:'0px'},zxcp);
     zxclst.onscroll=function(){ zxcScrollCk(this,zxchdrin); }
     var zxchdrin=zxcS('DIV',{position:'absolute',left:'0px',top:'0px',width:(parseInt(zxcp.style.width)-20)+'px'},zxchdr);
     for (var zxc0=0;zxc0<zxcary[0].length;zxc0++){
      var zxcd=zxcS('DIV',{position:'absolute',left:((zxc0>0)?zxcd.offsetLeft+zxcd.offsetWidth:0)+'px',top:'0px'},zxchdrin,zxcary[0][zxc0][0]);
      zxcd.className=zxcary[0][zxc0][1];
      zxcd.title=zxcary[0][zxc0][2]||null;
      if (zxcary[0][zxc0][3]){
       zxcd.fun=zxcary[0][zxc0][3];
       zxcd.nu=zxc0;
       zxcd.ud=true;
       zxcS(zxcd,{cursor:(document.all)?'hand':'pointer'});
       zxcd.onmouseup=function(){ zxcSort(this,zxclst,true); }
      }
     }
     zxcS(zxchdr,{height:zxcd.offsetHeight+'px'});
     var zxclstin=zxcS('DIV',{position:'relative',left:'0px',top:'0px'},zxclst);
     if (window['zxc'+zxcary[1]]){
      zxcS(zxclstin,{cursor:'n-resize'});
      zxclstin.onmousedown=function(){ window['zxc'+zxcary[1]](); }
      zxclstin.ondblclick=function(){ zxcCngText(); }
     }
     zxcS(zxchdr.cloneNode(false),{position:'relative'},zxclstin);
     for (var zxc1=2;zxc1<zxcary.length;zxc1++){
      var zxcrow=zxcS('DIV',{position:'relative'},zxclstin);
      for (var zxc1a=0;zxc1a<zxchdrin.childNodes.length;zxc1a++){
       var zxcd=zxcS('DIV',{position:'absolute',left:(zxchdrin.childNodes[zxc1a].offsetLeft)+'px',width:(zxchdrin.childNodes[zxc1a].offsetWidth)+'px',top:'0px'},zxcrow,zxcary[zxc1][zxc1a][0]);
       zxcd.className=zxcary[zxc1][zxc1a][1];
      }
      zxcS(zxcrow,{overflow:'hidden',width:(zxcd.offsetLeft+zxcd.offsetWidth)+'px',height:zxcrow.firstChild.offsetHeight+'px'});
     }
    }
    
    function zxcScrollCk(zxcobj,zxchdrin){
     zxcS(zxchdrin,{left:-zxcobj.scrollLeft+'px'});
    }
    
    var zxcObj;
    
    function zxcDragDrop(){
     var zxcevt=window.event||arguments.callee.caller.arguments[0];
     var zxcp=zxcEventObj(zxcevt).parentNode;
     var zxcpp=zxcp.parentNode;
     zxcObj=null;
     if (zxcpp.childNodes.length<4||zxcp.style.overflow!='hidden'){ return; }
     zxcobj=zxcS(zxcEventObj(zxcevt).parentNode.cloneNode(true),{position:'absolute',zIndex:'10',top:zxcp.offsetTop+'px'},zxcpp.parentNode);
     zxcMseDown(zxcobj,zxcp,zxcMse(zxcevt));
    }
    
    function zxcMseDown(zxcobj,zxcp,zxcy){
     document.onmousemove=function(event){zxcDrag(event);}
     document.onmouseup=function(event){zxcMseUp(event);}
     document.onselectstart=function(event){window.event.returnValue=false; }
     zxcObj=[zxcobj,zxcobj.offsetTop,zxcy,zxcp];
     zxcDragY=zxcMse(event)-zxcObj.offsetTop;
    }
    
    function zxcMseUp(event){
     if (!zxcObj){ return; }
     document.onmouseup=null;
     document.onmousemove=null;
     document.onselectstart=null;
     var zxcclds=zxcObj[3].parentNode.childNodes;
     if (zxcObj[0].offsetTop>5||zxcObj[0].offsetTop<zxcObj[0].parentNode.offsetHeight){
      for (var zxc0=0;zxc0<zxcclds.length;zxc0++){
       if (zxcclds[zxc0].offsetTop>zxcObj[0].offsetTop){
        zxcS(zxcObj[0],{position:'relative',top:'0px'});
        zxcObj[3].parentNode.insertBefore(zxcObj[0],zxcclds[zxc0]);
        zxcObj[3].parentNode.removeChild(zxcObj[3]);
        zxcObj=null;
        return;
       }
      }
     }
     zxcObj[0].parentNode.removeChild(zxcObj[0]);
     zxcObj=null;
    }
    
    function zxcDrag(event) {
     zxcObj[0].style.top=(zxcObj[1]+zxcMse(event)-zxcObj[2])+'px';
    }
    
    var zxcTA,zxcTATxt;
    
    function zxcCngText(zxcmde){
     var zxcevt=window.event||arguments.callee.caller.arguments[0];
     var zxcp=zxcEventObj(zxcevt);
     zxcTA=zxcS('TEXTAREA',{position:'absolute',left:'0px',top:'0px',fontSize:'12px'},zxcp);
     zxcTA.onkeyup=function(){ zxcTATxt=this.value; }
    }
    
    function zxcMse(event){
     if(!event) var event=window.event;
     if (document.all){ return event.clientY; }
     return event.pageY;
    }
    
    function zxcEventObj(zxce){
     if (!zxce) var zxce=window.event;
     zxce.cancelBubble=true;
     if (zxce.stopPropagation) zxce.stopPropagation();
     if (zxce.target) zxceobj=zxce.target;
     else if (zxce.srcElement) zxceobj=zxce.srcElement;
     if (zxceobj.nodeType==3) zxceobj=zxceobj.parentNode;
     return zxceobj;
    }
    
    function zxcEventAdd(zxco,zxct,zxcf) {
     if ( zxco.addEventListener ){ zxco.addEventListener(zxct, function(e){ zxco[zxcf](e);}, false); }
     else if ( zxco.attachEvent ){ zxco.attachEvent('on'+zxct,function(e){ zxco[zxcf](e); }); }
     else {
      var zxcPrev=zxco["on" + zxct];
      if (zxcPrev){ zxco['on'+zxct]=function(e){ zxcPrev(e); zxco[zxcf](e); }; }
      else { zxco['on'+zxct]=zxco[zxcf]; }
     }
    }
    
    var zxcEvt=0;
    
    function zxcAddEvt(zxc,zxcfun,zxcevt){
     zxc['zxcaddEvt'+zxcEvt]=window[zxcfun];
     zxcEventAdd(zxc,zxcevt,'zxcaddEvt'+zxcEvt);
     zxcEvt++;
    }
    
    var zxcSortCol;
    
    function zxcSort(zxcobj,zxclst,zxcud){
     zxcSortCol=zxcobj.nu;
     var zxcrows=zxclst.firstChild.childNodes;
     var zxcary=[];
     for (var zxc1=1;zxc1<zxcrows.length;zxc1++){
      zxcary.push(zxcrows[zxc1].cloneNode(true));
     }
     zxcary=zxcary.sort(window['zxc'+zxcobj.fun]);
     if (zxcobj.ud){ zxcary=zxcary.reverse(); }
     for (var zxc2=0;zxc2<zxcary.length;zxc2++){
      zxcrows[zxc2+1].parentNode.replaceChild(zxcary[zxc2],zxcrows[zxc2+1]);
     }
     zxcobj.ud=!zxcobj.ud;
    }
    
    function zxcSortAlpha(zxca,zxcb){
     var zxcaa=zxca.childNodes[zxcSortCol].firstChild.data;
     var zxcbb=zxcb.childNodes[zxcSortCol].firstChild.data;
     if (zxcaa<zxcbb) return -1;
     if (zxcaa>zxcbb) return 1;
     return 0;
    }
    
    function zxcSortNumeric(zxca,zxcb){
     var zxcaa=zxca.childNodes[zxcSortCol].firstChild.data.replace(/\D/g,'');
     var zxcbb=zxcb.childNodes[zxcSortCol].firstChild.data.replace(/\D/g,''); ;
     if (zxcaa<zxcbb) return -1;
     if (zxcaa>zxcbb) return 1;
     return 0;
    }
    
    function zxcS(zxcele,zxcstyle,zxcp,zxctxt){
     if (typeof(zxcele)=='string'){ zxcele=document.createElement(zxcele); }
     for (key in zxcstyle){ zxcele.style[key]=zxcstyle[key]; }
     if (zxcp){ zxcp.appendChild(zxcele); }
     if (zxctxt){ zxcele.appendChild(document.createTextNode(zxctxt)); }
     return zxcele;
    }
    
    function zxcKeyPress(zxcevt){
     if (zxcevt.keyCode==27&&zxcTA){
      if (zxcTATxt){
       if (zxcTATxt.length>0){
        zxcTA.parentNode.innerHTML=zxcTATxt;
       }
      }
      zxcTA=null;
      zxcTATxt=null;
     }
    }
    
    zxcAddEvt(document,'zxcKeyPress','keypress');
    
    //-->
    </script>
    
    </head>
    
    <body onload="zxcInitList('Tst1',zxcRowAry);">
    
    <div id="Tst1" style="position:relative;width:300px;height:200px;border:solid black 1px;" >
    </div>
    
    </body>
    
    </html>
    may be being a bit pushy but will replicate appearance of examples 3 and 4 and if your still not happy look at the tool-man code.

    dont realy want to do that as playing with somthing similar.
    Vic

    God Loves You and will never love you less.

    http://www.vicsjavascripts.org/Home.htm

    If my post has been useful please donate to http://www.operationsmile.org.uk/


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •