SHARE
TWEET

Untitled

a guest Jan 22nd, 2020 69 Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. <html>
  2. <head>
  3.  
  4. <style type="text/css">
  5.     #A {
  6.        
  7.        
  8.         width: 100px;
  9.         height: 50px;
  10.         background-color:lightskyblue;
  11.         font-size:40px;
  12.         display:block;
  13.         float:right;
  14.     }
  15.     #B {
  16.         width: 100px;
  17.         height:50px;
  18.        
  19.         background-color:orangered;
  20.         text-align:center;
  21.         font-size:40px;
  22.         display:block;
  23.         float:right;
  24.         position:absolute;
  25.         }
  26.     .crvena{
  27.         background-color:blue !important;
  28.     }
  29.  
  30.     div{
  31.    
  32.     }
  33.    
  34. </style>
  35.  
  36. </head>
  37.  
  38. <body>
  39. <div>
  40.     <span id="A"  style="margin-left:300px; margin-top:40px;">A</span>
  41.     <span id="B"  style="margin-left:0px; margin-top:40px;">B</span>
  42. </div>
  43.  
  44.  
  45. <script type="text/javascript">
  46.    var cvorA = document.getElementById("A");
  47.     var cvorB = document.getElementById("B");
  48.  
  49.    
  50.     document.body.addEventListener("keyup", pomjeriElementB);
  51.    
  52.     function pomjeriElementB(event){
  53.        
  54.        
  55.         var left=cvorB.style.getPropertyValue("margin-left");
  56.         var top=cvorB.style.getPropertyValue("margin-top");
  57.        
  58.             left= left.slice(0, -2);
  59.             top= top.slice(0, -2);
  60.         console.log(left);
  61.            
  62.         if(event.keyCode===68)
  63.         {
  64.                 left=parseInt(left)+50;
  65.                 //console.log(left);
  66.                 cvorB.setAttribute("style", "margin-left:"+(left)+"px;margin-top:"+(top)+"px");
  67.        
  68.         }
  69.        
  70.         if(event.keyCode===65)
  71.         {
  72.                 left=parseInt(left)-50;
  73.                 //console.log(left);
  74.                 cvorB.setAttribute("style", "margin-left:"+(left)+"px;margin-top:"+(top)+"px");
  75.            
  76.         }
  77.        
  78.         document.body.addEventListener("keyup", promijeniBoju);
  79.             function promijeniBoju(){
  80.                 if(cvorB.style.right = "100px"){
  81.                 cvorA.style.backgroundColor = "yellow";
  82.             }
  83.         }
  84.        
  85.     }
  86.    
  87. </script>
  88.  
  89. </body>
  90. </html>
RAW Paste Data
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy. OK, I Understand
Top