-2

I want to reproduce onfling event in javascript.
I know I have to calculate px/time but I don't know what time I have to take for reference.

Phiter
  • 14,570
  • 14
  • 50
  • 84
accaacco
  • 17
  • 4
  • It might be good to include a link to the event you want to reproduce for reference and also share some code to show us what you have tried, then we can help more efficiently. – jbehrens94 Aug 09 '16 at 13:37

1 Answers1

0

while this code is not fir for its intended purpose it does demonstrate how to "to calculate px/time "

<!DOCTYPE html>
<html lang="en">
<head>
<title>Fling Me</title>
<style>
div{
   position:absolute;
   top:300px;
   left:300px;
   width:100px;
   height:100px;
   background-color:red;
}
</style>
</head>
<body>
republicans must abandon trump or be complicit in his advocacy of assassinating a sitting president
<div></div>
<script>
'use strict';
(function(){
var mm,ox,oy,el,t,l,tt=0,tl=0,dt=0,dl=0,tmr,s;
document.querySelector('div').addEventListener('mousedown',
   function(ev){
      el = ev.target;
      s = el.style ;
      ox=ev.offsetX; oy=ev.offsetY;
      t=ev.clientY;l=ev.clientX; 
      tmr = setInterval(function(){    
         dt = tt - t;
         dl = tl - l;
         tt = t;
         tl = l;            
      },30);
      el.addEventListener('mousemove',
         mm = function(ev){ 
            t=ev.clientY;l=ev.clientX;
            s.top =  t - ox + 'px';
            s.left = l - oy + 'px';            
         }
      );
      el.addEventListener('mouseup',
         function(ev){
            clearInterval(tmr);
            el.removeEventListener('mousemove',mm);
            tmr = setInterval(function(){
               s.top =  parseInt(s.top) - dt + 'px';
               s.left = parseInt(s.left) - dl + 'px';
            },30);
            setTimeout("location.assign(location.href)",2000);
         }
      );
   }
)})();
</script>
</body>
</html>
daveyerwin
  • 1
  • 1
  • Hi,i don't understand this part of code: el.addEventListener('mouseup', function(ev){ clearInterval(tmr); el.removeEventListener('mousemove',mm); tmr = setInterval(function(){ s.top = parseInt(s.top) - dt + 'px'; s.left = parseInt(s.left) - dl + 'px'; },30); setTimeout("location.assign(location.href)",2000); } ); Why do you set an other timer after mouse up? – accaacco Aug 10 '16 at 18:14