API tools faq
paste
Advertisement
Guest User

HTMLTEST

a guest
Oct 21st, 2017
75
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 6.02 KB | None | 0 0
raw download clone embed print report
  1. <html>
  2. <head>
  3. </head>
  4.  
  5. <style>
  6. body {background-color: lightyellow}
  7. h1 {color:blue}
  8.  
  9. button {
  10.    border: 1px solid #0a3c59;
  11.    background: #808385;
  12.    background: -webkit-gradient(linear, left top, left bottom, from(#e0e0e0), to(#808385));
  13.    background: -webkit-linear-gradient(top, #e0e0e0, #808385);
  14.    background: -moz-linear-gradient(top, #e0e0e0, #808385);
  15.    background: -ms-linear-gradient(top, #e0e0e0, #808385);
  16.    background: -o-linear-gradient(top, #e0e0e0, #808385);
  17.    background-image: -ms-linear-gradient(top, #e0e0e0 0%, #808385 100%);
  18.    padding: 10.5px 21px;
  19.    -webkit-border-radius: 6px;
  20.    -moz-border-radius: 6px;
  21.    border-radius: 6px;
  22.    -webkit-box-shadow: rgba(255,255,255,0.4) 0 1px 0, inset rgba(255,255,255,0.4) 0 1px 0;
  23.    -moz-box-shadow: rgba(255,255,255,0.4) 0 1px 0, inset rgba(255,255,255,0.4) 0 1px 0;
  24.    box-shadow: rgba(255,255,255,0.4) 0 1px 0, inset rgba(255,255,255,0.4) 0 1px 0;
  25.    text-shadow: #7ea4bd 0 1px 0;
  26.    color: #06426c;
  27.    font-size: 14px;
  28.    font-family: helvetica, serif;
  29.    text-decoration: none;
  30.    vertical-align: middle;
  31.    }
  32. button:hover {
  33.    border: 1px solid #0a3c59;
  34.    text-shadow: #1e4158 0 1px 0;
  35.    background: #747678;
  36.    background: -webkit-gradient(linear, left top, left bottom, from(#c0c1c2), to(#747678));
  37.    background: -webkit-linear-gradient(top, #c0c1c2, #747678);
  38.    background: -moz-linear-gradient(top, #c0c1c2, #747678);
  39.    background: -ms-linear-gradient(top, #c0c1c2, #747678);
  40.    background: -o-linear-gradient(top, #c0c1c2, #747678);
  41.    background-image: -ms-linear-gradient(top, #c0c1c2 0%, #747678 100%);
  42.    color: #fff;
  43.    }
  44. button:active {
  45.    text-shadow: #1e4158 0 1px 0;
  46.    border: 1px solid #0a3c59;
  47.    background: #707070;
  48.    background: -webkit-gradient(linear, left top, left bottom, from(#969696), to(#747678));
  49.    background: -webkit-linear-gradient(top, #969696, #707070);
  50.    background: -moz-linear-gradient(top, #969696, #707070);
  51.    background: -ms-linear-gradient(top, #969696, #707070);
  52.    background: -o-linear-gradient(top, #969696, #707070);
  53.    background-image: -ms-linear-gradient(top, #969696 0%, #707070 100%);
  54.    color: #fff;
  55.    }
  56. </style>
  57.  
  58. <body>
  59.  
  60. <div style="text-align:center">
  61.  
  62. <h1> Robotoid's lights control <img style="height: 100px"src="/images/robot52.png"> </h1>
  63. <br><br>
  64. <span style="display:inline-block;padding:5px;border:1px solid #fc0; font-size: 140%;font-weight: bold;">
  65. <button style="height: 70px; width: 100px" onclick="lighton()"><img style="height: 40px"src="/images/lighton.png"></button>
  66. <img hspace="20" style="padding-left: 200px">
  67. <button style="height: 70px; width: 100px" onclick="lightoff()"><img style="height: 35px"src="/images/lightoff.png"></button>
  68. </span>
  69. <br><br>
  70. <br>
  71.     <button style="height: 90px; width: 100px" onclick="forward()"><img style="height: 65px"src="/images/forward.png"></button>
  72.     <br><br><br><br>
  73.     <img hspace="10" style="padding-left: 5px">
  74.     <button style="height: 90px; width: 100px" onclick="left()"><img style="height: 65px"src="/images/left.png"></button>
  75.     <img hspace="20" style="padding-left: 10px">
  76.     <button style="height: 90px; width: 100px" onclick="stop()"><img style="height: 63px"src="/images/stop.png"></button>
  77.     <img hspace="20" style="padding-left: 10px">
  78.     <button style="height: 90px; width: 100px" onclick="right()"><img style="height: 65px"src="/images/right.png"></button>
  79.     <img hspace="10" style="padding-left: 5px">
  80.     <br><br><br><br>
  81.     <button style="height: 90px; width: 100px" onclick="reverse()"><img style="height: 65px"src="/images/reverse.png"></button>
  82.     <br><br><br>
  83.  
  84.     <p>Motor speed control</p>
  85.     <img hspace="10" style="padding-left: 5px">
  86.     <button style="height: 50px; width: 50px; font-size: 18px" onclick="nospeed()">0</button>
  87.     <img hspace="30" style="padding-left: 20px">
  88.     <button style="height: 50px; width: 50px; font-size: 18px" onclick="lowspeed()">--</button>
  89.     <img hspace="30" style="padding-left: 20px">
  90.     <button style="height: 50px; width: 50px; font-size: 18px" onclick="regularspeed()">==</button>
  91.     <img hspace="30" style="padding-left: 20px">
  92.     <button style="height: 50px; width: 50px; font-size: 18px" onclick="highspeed()">++</button>
  93.     <img hspace="10" style="padding-left: 5px">
  94.     <br><br>
  95.  
  96. <script>
  97. var xmlhttp;
  98. xmlhttp=new XMLHttpRequest();
  99.  
  100. function lighton()
  101.     {
  102.         xmlhttp.open("GET","cgi-bin/lighton.cgi",true);
  103.         xmlhttp.send();
  104.     }
  105. function lightoff()
  106.     {
  107.         xmlhttp.open("GET","cgi-bin/lightoff.cgi",true);
  108.         xmlhttp.send();
  109.     }
  110.  
  111. function forward()
  112. {
  113.     xmlhttp.open("GET","cgi-bin/forward.cgi",true);
  114.     xmlhttp.send();
  115. }
  116. function stop()
  117. {
  118.     xmlhttp.open("GET","cgi-bin/nospeed.cgi",true);
  119.     xmlhttp.send();
  120. }
  121. function left()
  122. {
  123.     xmlhttp.open("GET","cgi-bin/left.cgi",true);
  124.     xmlhttp.send();
  125. }
  126. function right()
  127. {
  128.     xmlhttp.open("GET","cgi-bin/right.cgi",true);
  129.     xmlhttp.send();
  130. }
  131. function reverse()
  132. {
  133.     xmlhttp.open("GET","cgi-bin/reverse.cgi",true);
  134.     xmlhttp.send();
  135. }
  136.  
  137. function lowspeed()
  138. {
  139.     xmlhttp.open("GET","cgi-bin/lowspeed.cgi",true);
  140.     xmlhttp.send();
  141. }
  142. function regularspeed()
  143. {
  144.     xmlhttp.open("GET","cgi-bin/medspeed.cgi",true);
  145.     xmlhttp.send();
  146. }
  147. function highspeed()
  148. {
  149.     xmlhttp.open("GET","cgi-bin/highspeed.cgi",true);
  150.     xmlhttp.send();
  151. }
  152. function nospeed()
  153. {
  154.     xmlhttp.open("GET","cgi-bin/nospeed.cgi",true);
  155.     xmlhttp.send();
  156. }
  157. function arm_up()
  158. {
  159.     xmlhttp.open("GET","cgi-bin/ARM_Up.cgi",true);
  160.     xmlhttp.send();
  161. }
  162. function arm_center()
  163. {
  164.     xmlhttp.open("GET","cgi-bin/ARM_Center.cgi",true);
  165.     xmlhttp.send();
  166. }
  167. function arm_down()
  168. {
  169.     xmlhttp.open("GET","cgi-bin/ARM_Down.cgi",true);
  170.     xmlhttp.send();
  171. }
  172. function grip_open()
  173. {
  174.     xmlhttp.open("GET","cgi-bin/GRIP_OPEN.cgi",true);
  175.     xmlhttp.send();
  176. }
  177. function grip_small()
  178. {
  179.     xmlhttp.open("GET","cgi-bin/GRIP_Small.cgi",true);
  180.     xmlhttp.send();
  181. }
  182. function grip_med()
  183. {
  184.     xmlhttp.open("GET","cgi-bin/GRIP_Med.cgi",true);
  185.     xmlhttp.send();
  186. }
  187. function grip_big()
  188. {
  189.     xmlhttp.open("GET","cgi-bin/GRIP_Big.cgi",true);
  190.     xmlhttp.send();
  191. }
  192.  
  193.  
  194.  
  195.  
  196.  
  197.  
  198.        
  199. </script>
  200.  
  201. </body>
  202. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement
Public Pastes
Advertisement
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
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!