RageQxeen

Scarecrow

Jun 18th, 2022 (edited)
28
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 7.46 KB | None | 0 0
  1. <html>
  2. <body>
  3. <script defer>
  4. window.onload = function() {
  5. var isCtrl = false;
  6. document.onkeyup=function(e)
  7. {
  8. if(e.which == 17)
  9. isCtrl=false;
  10. }
  11. document.onkeydown=function(e)
  12. {
  13. if(e.which == 17)
  14. isCtrl=true;
  15. if((e.which == 85) || (e.which == 67) && (isCtrl == true))
  16. {
  17. return false;
  18. }
  19. }
  20. var isNS = (navigator.appName == "Netscape") ? 1 : 0;
  21. if(navigator.appName == "Netscape") document.captureEvents(Event.MOUSEDOWN||Event.MOUSEUP);
  22. function mischandler(){
  23. return false;
  24. }
  25. function mousehandler(e){
  26. var myevent = (isNS) ? e : event;
  27. var eventbutton = (isNS) ? myevent.which : myevent.button;
  28. if((eventbutton==2)||(eventbutton==3)) return false;
  29. }
  30. document.oncontextmenu = mischandler;
  31. document.onmousedown = mousehandler;
  32. document.onmouseup = mousehandler;
  33.  
  34. if (document.addEventListener) { // IE >= 9; other browsers
  35. document.addEventListener('contextmenu', function(e) {
  36. alert(" Try asking RageQxeen for her codes instead."); //here you draw your own menu
  37. e.preventDefault();
  38. }, false);
  39. } else { // IE < 9
  40. document.attachEvent('oncontextmenu', function() {
  41. alert("O sun, abide to death.");
  42. window.event.returnValue = false;
  43. });
  44. }
  45. };
  46. </script>
  47. <style type="text/css">
  48.  
  49. @import url(https://fonts.googleapis.com/css?family=Cinzel|Aref+Ruqaa);
  50.  
  51. html, body {
  52. background: #ADA9B7;
  53. background-image:url("");
  54. background-size:400px;
  55. background-repeat:no-repeat;
  56. background-position:center bottom;
  57. }
  58.  
  59. ::-webkit-scrollbar-button:vertical:{
  60. background-color: #transparent;}
  61.  
  62. ::-webkit-scrollbar-thumb:vertical {
  63. background-color:#transparent;
  64. height:150px;}
  65.  
  66. ::-webkit-scrollbar-thumb:horizontal {
  67. background-color:#transparent;
  68. height:60px;}
  69.  
  70.  
  71. ::-webkit-scrollbar {
  72. height:60px;
  73. width:5px;
  74. background-color:#transparent;}
  75.  
  76. #image {
  77. width: 45vw;
  78. margin: 0px;
  79. border: none;
  80. height: 45vw;
  81. background-color:transparent;
  82. position: absolute;
  83. right: 0vw;
  84. top: 3vw;
  85. background-image:url("https://i.ibb.co/cL1wmG0/8.png");
  86. background-repeat:no-repeat;
  87. background-position: top;
  88. background-size: 100%;
  89. z-index: 7;
  90. filter: drop-shadow(30px 10px 4px #000);
  91. -webkit-transition: 0.5s linear;
  92. -moz-transition: 0.5s linear;
  93. -o-transition: 0.5s linear;
  94. transition: 0.5s linear;
  95. -webkit-animation: fade-in-fwd 1s cubic-bezier(0.390, 0.575, 0.565, 1.000) 2s both;
  96. animation: fade-in-fwd 1s cubic-bezier(0.390, 0.575, 0.565, 1.000) 2s both;
  97. }
  98.  
  99. #image:hover {
  100. background-image:url("https://i.ibb.co/zFcyfw8/9.png");
  101. background-repeat:no-repeat;
  102. background-position: top;
  103. background-size: 100%;
  104. -webkit-transition: 0.5s linear;
  105. -moz-transition: 0.5s linear;
  106. -o-transition: 0.5s linear;
  107. transition: 0.5s linear;
  108. }
  109.  
  110. #image2 {
  111. width: 45vw;
  112. margin: 0px;
  113. border: none;
  114. height: 10vw;
  115. background-color:transparent;
  116. position: absolute;
  117. right: 20vw;
  118. bottom: 25vw;
  119. background-image:url("https://i.ibb.co/kK5DLk6/13.jpg");
  120. background-repeat:no-repeat;
  121. background-position: top;
  122. background-size: 100%;
  123. border: 3px solid #000;
  124. z-index: 1;
  125. }
  126.  
  127. #image3 {
  128. width: 50vw;
  129. margin: 0px;
  130. border: none;
  131. height: 10vw;
  132. background-color:transparent;
  133. position: absolute;
  134. right: 20vw;
  135. bottom: 14vw;
  136. background-image:url("https://i.ibb.co/x6dVjn6/12.jpg");
  137. background-repeat:no-repeat;
  138. background-position: center;
  139. background-size: 100%;
  140. border: 3px solid #000;
  141. z-index: 1;
  142. }
  143.  
  144. #image4 {
  145. width: 55vw;
  146. margin: 0px;
  147. border: none;
  148. height: 10vw;
  149. background-color:transparent;
  150. position: absolute;
  151. right: 20vw;
  152. bottom: 3vw;
  153. background-image:url("https://i.ibb.co/QkYjVBL/16.jpg");
  154. background-repeat:no-repeat;
  155. background-position: center;
  156. background-size: 100%;
  157. border: 3px solid #000;
  158. z-index: 1;
  159. }
  160.  
  161. .name {position: absolute;
  162. font-family: 'Cinzel';
  163. color: #fff;
  164. font-size: 4vw;
  165. bottom: 30vw;
  166. right: 40vw;
  167. width: 25vw;
  168. height: 9vw;
  169. border: 0px solid #000;
  170. text-align: justify;
  171. text-shadow: -1px 0 #c0c0c0, 0 1px #000,1px 0 #000, 0 -1px #c0c0c0;
  172. overflow: auto;
  173. padding:5px 5px 5px 5px;
  174. z-index: 2;}
  175.  
  176. .title { background: transparent;
  177. background:url('https://nicholeshinn.com/wp-content/uploads/2021/05/BiodegradableBoringImago-size_restricted.gif') repeat;
  178. background-position: center;
  179. position: absolute;
  180. font-family: 'Cinzel';
  181. font-size: 4vw;
  182. bottom: 30vw;
  183. right: 40vw;
  184. width: 25vw;
  185. height: 9vw;
  186. text-align: justify;
  187. padding:5px 5px 5px 5px;
  188. -webkit-text-fill-color: transparent;
  189. -webkit-background-clip: text;
  190. z-index: 3;}
  191.  
  192. #container {
  193. display: inline-block;
  194. background-color: transparent;
  195. width: 45vw;
  196. height: 0.1vm;
  197. margin:auto;
  198. position: absolute;
  199. padding: 5px;
  200. right: 20vw;
  201. bottom: 25vw;
  202. z-index:4;
  203. transition: 0.8s linear;
  204. -o-transition: 0.8s linear;
  205. -ms-transition: 0.8s linear;
  206. -moz-transition: 0.8s linear;
  207. -webkit-transition: 0.8s linear;
  208. }
  209.  
  210. #container:hover {
  211. display: inline-block;
  212. width: 45vw;
  213. height: 0.1vw;
  214. z-index: 5;
  215. transition: 0.8s linear;
  216. -o-transition: 0.8s linear;
  217. -ms-transition: 0.8s linear;
  218. -moz-transition: 0.8s linear;
  219. -webkit-transition: 0.8s linear;
  220. }
  221.  
  222. #stats {
  223. background-color: #ADA9B7;
  224. width: 32vw;
  225. height: 28vw;
  226. margin:auto;
  227. position: absolute;
  228. font-size: 15px;
  229. font-family: 'Aref Ruqaa', cursive;
  230. padding: 10px;
  231. color:#000;
  232. left: -5vw;
  233. bottom: -21vw;
  234. border: 2px solid #000;
  235. box-shadow: 0px 0px 20px 10px #8332ac;
  236. z-index:1;
  237. }
  238.  
  239. .fade {
  240. opacity: 0;
  241. -webkit-transition: opacity 2s ease-in-out;
  242. -moz-transition: opacity 2s ease-in-out;
  243. -o-transition: opacity 2s ease-in-out;
  244. -ms-transition: opacity 2s ease-in-out;
  245. transition: opacity 2s ease-in-out;
  246. }
  247.  
  248. .fade:hover {
  249. opacity: 1;
  250. }
  251.  
  252. i{color: #ADA9B7;}
  253. b{color: #110520;}
  254. a{color: #4C5B5C; text-decoration: none;}
  255. h1{border-bottom: 1px solid #BA55D3; text-align: center; font-size: 30px; font-family: 'Cinzel', cursive; color: #000;}
  256. h2{text-align: right; font-size: 25px; font-family: 'Cinzel', cursive; color: #000;}
  257. </style>
  258.  
  259. <div id="image"></div>
  260.  
  261. <div id="image2"></div>
  262. <div id="image3"></div>
  263. <div id="image4"></div>
  264.  
  265. <div class="name">Scarecrow</div>
  266. <div class="title">Scarecrow</div>
  267.  
  268. <div id="container" class="fade">
  269. <div id="stats">
  270. <div style="width: 32vw; height: 28vw; overflow-y: hidden;">
  271.  
  272. <a name="one"></a>
  273. <div style="width: 32vw; height: 28vw; overflow: auto;" align="left">
  274. <h1>Statistics</h1>
  275.  
  276. <font style=float:left><b>Name</b></font> <font style=float:right></font><br>
  277. <font style=float:left><b>Nickname</b></font> <font style=float:right><a title="">hover</a></font><br>
  278. <font style=float:left><b>Gender</b></font> <font style=float:right></font><br>
  279. <font style=float:left><b>Apparent Age</b></font> <font style=float:right></font><br>
  280. <font style=float:left><b>Race</b></font> <font style=float:right></font><br><br>
  281. <font style=float:left><b>Height</b></font> <font style=float:right></font><br>
  282. <font style=float:left><b>Weight</b></font> <font style=float:right></font><br>
  283. <font style=float:left><b>Tresses</b></font> <font style=float:right></font><br>
  284. <font style=float:left><b>Irises</b></font> <font style=float:right></font><br><br>
  285. <font style=float:left><b>Marital</b></font> <font style=float:right></font><br>
  286. <font style=float:left><b>Orientation</b></font> <font style=float:right></font><br><br>
  287.  
  288.  
  289. <h1>Abilities</h1>
  290.  
  291. TBA
  292.  
  293. <h1>History</h1>
  294.  
  295. TBA
  296.  
  297. <h1>Out of Character</h1>
  298.  
  299. TBA
  300. </div>
  301. </div>
  302. </div>
  303. </div>
  304. </body>
  305. </html>
Add Comment
Please, Sign In to add comment