SHARE
TWEET

Untitled

a guest Jan 25th, 2020 83 Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. <!DOCTYPE html>
  2. <html lang="pl-PL">
  3. <head>
  4.     <meta charset="UTF-8">
  5.     <meta name="viewport" content="width=device-width, initial-scale=1.0">
  6.     <meta http-equiv="X-UA-Compatible" content="ie=edge">
  7.     <title>CSS Anim</title>
  8.     <style>
  9.         .animacja {
  10.             animation: move .4s;
  11.         }
  12.  
  13.         .player {
  14.             background-color: blueviolet;
  15.             width: 100px;
  16.             height: 100px;
  17.             position: absolute;
  18.             top: 200px;
  19.             left: 50px;
  20.         }
  21.  
  22.         @keyframes move {
  23.             to{transform: translateX(100px);}
  24.         }
  25.     </style>
  26. </head>
  27. <body>
  28.     <button id='steer' onclick="animacja();">MOVE NIGGASa</button>
  29.     <div class="player"></div>
  30.  
  31.     <script>
  32.         function animacja() {
  33.             const player = document.querySelector('.player');
  34.             player.classList.toggle('animacja');
  35.         }
  36.     </script>
  37. </body>
  38. </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