javascript - Draggable element without JQuery -


i trying make draggable library sort of thing 1 of projects, struggling bit making elements draggable. when element touches top of container starts rebound more move mouse up, randomly gets stuck. got ideas why it's doing this, put in checks try prevent it.

    setdraghandlers: function(obj,objishandler,container) /* if object handler, parent thing moved */     {         var tomove = (!objishandler ? obj : obj.parentnode),             handlestyles,             objstyles,             containerstyles,             objleft,             objtop,             objwidth,             objheight,             handlewidth,             handleheight,             containerwidth,             containerheight,             mousex,             mousey;          var movelistener = function(e)         {             var mousex_new = dragger.mousex(e),                 mousey_new = dragger.mousey(e),                 mousex_diff = (mousex > mousex_new ? mousex - mousex_new : mousex_new - mousex),                 mousey_diff = (mousey > mousey_new ? mousey - mousey_new : mousey_new - mousey),                 objtop_new = objtop + mousey_diff,                 objleft_new = objtop + mousex_diff;             dragger.log(mousex_new);             if             (                 objtop_new + objheight > containerheight || objtop < 0                 ||                 objleft_new + objwidth > containerwidth || objleft < 0                 ||                 mousex < 0 || mousey < 0 || mousex > window.innerwidth || mousey > window.innerheight             ) /* go out of bounds */                 return;              if(tomove.style.top == '' || tomove.style.top == null)                 tomove.setattribute('style',tomove.getattribute('style') + 'top:' + objtop_new + 'px;' + 'left:' + objleft_new + 'px;');             else             {                 tomove.style.top = objtop_new + 'px'; /* px taken away cursor throw mouseup when mouse up. without cursor far left or far , throw */                 tomove.style.left = objleft_new + 'px';             }             e.preventdefault();         };          dragger.addeventlistener(obj,'mousedown',function(e){             if(e.which != 1) /* left mouse button not down */                 return;             /* redefine vars incase have changed */             handlestyles = dragger.getfinalstyles(obj);             objstyles = dragger.getfinalstyles(tomove);             containerstyles = (container == null || container == undefined                                 ?                                     {                                         height: window.innerheight + 'px', /* done less checks need done further on. makes object can containers width , height */                                         width: window.innerwidth + 'px'                                     }                                 :                                     dragger.getfinalstyles(container) /* generated fresh every time container can resized without trouble */                               );             /* object moving */             objleft = objstyles.left.replace('px','');             objtop = objstyles.top.replace('px','');             objwidth = objstyles.width.replace('px','');             objheight = objstyles.height.replace('px','');              /* object user has clicked , dragged move */             handlewidth = handlestyles.width.replace('px','');             handleheight = handlestyles.height.replace('px','');              /* container object move inside */             containerwidth = containerstyles.width.replace('px','');             containerheight = containerstyles.height.replace('px','');              /* mouse position */             mousex = dragger.mousex(e);             mousey = dragger.mousey(e);              dragger.addeventlistener(document,'mousemove',movelistener);             e.preventdefault();         });          dragger.addeventlistener(obj,'mouseup',function(e){             if(e.which != 1) /* left mouse button not down */                     return;             dragger.removeeventlistener(document,'mousemove',movelistener)         })     } 


Comments

Popular posts from this blog

ios - UICollectionView Self Sizing Cells with Auto Layout -

node.js - ldapjs - write after end error -

DOM Manipulation in Wordpress (and elsewhere) using php -