Advertisement
1xptolevitico69

JAVASCRIPT ANIMATION LOADER + PLAY BUTTON (UPDATED)

Aug 24th, 2024 (edited)
100
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 2.40 KB | None | 0 0
  1. <!DOCTYPE html>
  2. <html lang="en">
  3.    <head>
  4.       <meta charset="UTF-8" />
  5.       <meta http-equiv="X-UA-Compatible" content="IE=edge" />
  6.       <meta name="viewport" content="width=device-width, initial-scale=1.0" />
  7.       <title>SETUP</title>
  8.       <style>
  9.  
  10.  
  11.          body {
  12.             margin: 0;
  13.          }
  14.  
  15.          * {
  16.             box-sizing: border-box;
  17.             font-family: arial black;
  18.          }
  19.  
  20.          .top {
  21.             width: 100%;
  22.             height: 100vh;
  23.             border: 0;
  24.             outline: 0;
  25.             background-color: white;
  26.          }
  27.  
  28.          .top a {
  29.             display: block;
  30.             color: red;
  31.             margin: 0 5px;
  32.             text-decoration: none;
  33.             font-weight: 900;
  34.             font-size: 25px;
  35.          }
  36.  
  37.          .top input {
  38.             display: inline-block;
  39.             margin: 3px;
  40.          }
  41.  
  42.          h1 {
  43.             margin: 30px 0;
  44.          }
  45.  
  46.          .search {
  47.             outline: 3px solid red;
  48.             font-size: 20px;
  49.             width: 150px;
  50.             text-align: center;
  51.             border: 2px solid white;
  52.             color: red;
  53.             background-color: red;
  54.             color: white;
  55.          }
  56.  
  57.          @media (orientation: portrait) and (max-width:425px){
  58.             .top input {
  59.                display: block;
  60.                margin: 9px auto;
  61.             }
  62.  
  63.             h1 {
  64.                font-size: 20px;
  65.             }
  66.          }
  67.  
  68.          @media (orientation: landscape) and (max-width: 640px) {
  69.             h1 {
  70.                font-size: 20px;
  71.             }
  72.          }
  73.  
  74.       </style>
  75.    </head>
  76.  
  77.    <body>
  78.  
  79.       <button class="top">
  80.          <a href="https://1xpto.netlify.app/">Home</a>
  81.  
  82.          <h1>JAVASCRIPT ANIMATION LOADER (UPDATED) </h1>
  83.  
  84.          <input class="search" onclick="Web()" type="button" value="HTML" />
  85.          <input class="search" onclick="Style()" type="button" value="TXT" />
  86.       </button>
  87.  
  88.       <script>
  89.  
  90.          function Web() {
  91.             window.open("https://1xpto.netlify.app/articles/javascript%20animation%20(%20loader%20+%20play%20button%20)%20onload/", "_self");
  92.          }
  93.  
  94.          function Style() {
  95.             window.open("https://1xpto.netlify.app/articles/javascript%20animation%20(%20loader%20+%20play%20button%20)%20onload/index.txt", "_self");
  96.          }
  97.  
  98.  
  99.  
  100.       </script>
  101.    </body>
  102. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement