RageQxeen

Katsumi

Feb 26th, 2020
66
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 12.44 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=Bangers|Girassol|Parisienne&display=swap');
  50.  
  51. html, body {
  52. background-color: #8f8f8f;
  53. background-image: url("https://www.transparenttextures.com/patterns/brick-wall-dark.png");
  54. background-size: 300px;
  55. background-repeat: 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: 30vw;
  78. margin: 0px;
  79. border: none;
  80. height: 40vw;
  81. background-color:transparent;
  82. position: absolute;
  83. left: 0vw;
  84. bottom: 0vw;
  85. background-image:url("http://i.picpar.com/yWde.png");
  86. background-repeat:no-repeat;
  87. background-position: bottom;
  88. background-size: 100%;
  89. }
  90.  
  91. #stats {
  92. background-color:#c0c0c0;
  93. width: 30vw;
  94. height: 15vw;
  95. margin:auto;
  96. position: absolute;
  97. padding: 5px;
  98. font-family: 'Girassol', cursive;
  99. font-size: 15px;
  100. color: #000;
  101. left: 30vw;
  102. bottom: 20vw;
  103. z-index:1;
  104. border: #000000 solid 2px;
  105. }
  106.  
  107. #friends {
  108. background-color:#c0c0c0;
  109. width: 40vw;
  110. height: 15vw;
  111. margin:auto;
  112. position: absolute;
  113. padding: 5px;
  114. font-family: 'Girassol', cursive;
  115. font-size: 15px;
  116. color: #000;
  117. left: 40vw;
  118. bottom: 2vw;
  119. z-index:2;
  120. border: #000000 solid 2px;
  121. }
  122.  
  123. #ooc {
  124. background-color:#c0c0c0;
  125. width: 20vw;
  126. height: 11.5vw;
  127. margin:auto;
  128. position: absolute;
  129. padding: 5px;
  130. font-family: 'Girassol', cursive;
  131. font-size: 15px;
  132. color: #000;
  133. left: 63vw;
  134. bottom: 24vw;
  135. z-index:1;
  136. border: #000000 solid 2px;
  137. transform: rotate(30deg);
  138. }
  139.  
  140. #nav {
  141. background-color: transparent;
  142. width: 2vw;
  143. height: 1.7vw;
  144. margin:auto;
  145. position: absolute;
  146. left: 78vw;
  147. bottom: 15vw;
  148. text-align:right;
  149. z-index:1;
  150. }
  151.  
  152. #nav a, #nav a:link, #nav a:visited {
  153. display:inline-block;
  154. height: .5vw;
  155. width: 3vw;
  156. text-decoration:none;
  157. background: #c0c0c0;
  158. margin: 5px;
  159. border: double #000 5px;
  160. -webkit-transition: 0.5s linear;
  161. -moz-transition: 0.5s linear;
  162. -o-transition: 0.5s linear;
  163. transition: 0.5s linear;
  164. z-index:5;
  165. }
  166.  
  167. #nav a:active, #nav a:hover {
  168. display:inline-block;
  169. height: .5vw;
  170. width: 3vw;
  171. text-decoration:none;
  172. background: #30AA4A;
  173. margin: 5px;
  174. border: double #000 5px;
  175. -webkit-transition: 0.5s linear;
  176. -moz-transition: 0.5s linear;
  177. -o-transition: 0.5s linear;
  178. transition: 0.5s linear;
  179. z-index:5;
  180. }
  181.  
  182. .name {position: absolute;
  183. font-family: 'Parisienne';
  184. color: #fff;
  185. font-size: 6vw;
  186. bottom: 35vw;
  187. left: 30vw;
  188. width: 25vw;
  189. height: 9vw;
  190. border: 0px solid #000;
  191. text-align: center;
  192. text-shadow: -1px 0 #c0c0c0, 0 1px #000,1px 0 #000, 0 -1px #c0c0c0;
  193. overflow: auto;
  194. padding:5px 5px 5px 5px;
  195. z-index: 2;}
  196.  
  197. .title { background: transparent;
  198. background:url('https://i.pinimg.com/originals/4a/66/86/4a66864a0a74a58af9d12c861cdceef5.gif') 50px 50px repeat;
  199. background-position: center;
  200. position: absolute;
  201. font-family: 'Parisienne';
  202. font-size: 6vw;
  203. bottom: 35vw;
  204. left: 30vw;
  205. width: 25vw;
  206. height: 9vw;
  207. text-align: center;
  208. padding:5px 5px 5px 5px;
  209. -webkit-text-fill-color: transparent;
  210. -webkit-background-clip: text;
  211. z-index: 3;}
  212.  
  213. .alias {position: absolute;
  214. font-family: 'Bangers';
  215. color: #000;
  216. font-size: 2vw;
  217. bottom: 16.5vw;
  218. left: 35vw;
  219. width: 40vw;
  220. height: 3vw;
  221. border: 0px solid #000;
  222. text-align: center;
  223. text-shadow: -1px 0 #c0c0c0, 0 1px #000,1px 0 #000, 0 -1px #c0c0c0;
  224. overflow: auto;
  225. padding:5px 5px 5px 5px;
  226. z-index: 2;}
  227.  
  228. #editthis{
  229. position:fixed;
  230. height: 27px;
  231. width: 30px;
  232. bottom: 21.3vw;
  233. left: 65.15vw;
  234. margin: auto;
  235. border-radius: 50%;
  236. z-index:99;
  237. }
  238.  
  239. #music1{
  240. position:fixed;
  241. padding:2px;
  242. -webkit-transition: all 0.5s ease-in-out;
  243. -moz-transition: all 0.5s ease-in-out;
  244. -o-transition: all 0.5s ease-in-out;
  245. }
  246.  
  247. #music1:hover #music2{
  248. opacity: 0;
  249. margin-top:-20px;
  250. z-index:-1;
  251. }
  252.  
  253. #music1:hover #music3{
  254. opacity: .5;
  255. margin-top:-5px;
  256. z-index:99;
  257. }
  258.  
  259. #music1:hover #musiclist{
  260. opacity: .5;
  261. }
  262.  
  263. #music2{
  264. opacity: .5;
  265. background-color:#000000;
  266. padding:6px;
  267. border-radius: 50%;
  268. -webkit-transition: all 0.5s ease-in-out;
  269. -moz-transition: all 0.5s ease-in-out;
  270. -o-transition: all 0.5s ease-in-out;
  271. }
  272.  
  273. #music3{
  274. opacity: 0;
  275. position:fixed;
  276. background-color:#000000;
  277. background-image: url('http://assets.clickmotive.com/Designs/LEMidnight/playButton.png');
  278. background-repeat: no-repeat;
  279. background-size: 25px;
  280. border:1px dotted #b3b3e5;
  281. border-radius: 50%;
  282. width:25px;
  283. height:25px;
  284. z-index:99
  285. margin-left:0px;
  286. overflow:hidden;
  287. -webkit-transition: all 0.5s ease-in-out;
  288. -moz-transition: all 0.5s ease-in-out;
  289. -o-transition: all 0.5s ease-in-out;
  290. }
  291.  
  292. #subwoofer1 {
  293. width: 8vw;
  294. margin: 0px;
  295. border: none;
  296. height: 9vw;
  297. background-color:transparent;
  298. position: absolute;
  299. left: 62vw;
  300. bottom: 18vw;
  301. background-image:url("https://i.ya-webdesign.com/images/speaker-transparent-cartoon-6.png");
  302. background-repeat:no-repeat;
  303. background-position: bottom;
  304. background-size: 100%;
  305. z-index: 2;
  306. -webkit-animation: heartbeat 1s ease-in-out infinite both;
  307. animation: heartbeat 1s ease-in-out infinite both;
  308. }
  309.  
  310. @-webkit-keyframes heartbeat {
  311. from {
  312. -webkit-transform: scale(1);
  313. transform: scale(1);
  314. -webkit-transform-origin: center center;
  315. transform-origin: center center;
  316. -webkit-animation-timing-function: ease-out;
  317. animation-timing-function: ease-out;
  318. }
  319. 10% {
  320. -webkit-transform: scale(0.91);
  321. transform: scale(0.91);
  322. -webkit-animation-timing-function: ease-in;
  323. animation-timing-function: ease-in;
  324. }
  325. 17% {
  326. -webkit-transform: scale(0.98);
  327. transform: scale(0.98);
  328. -webkit-animation-timing-function: ease-out;
  329. animation-timing-function: ease-out;
  330. }
  331. 33% {
  332. -webkit-transform: scale(0.87);
  333. transform: scale(0.87);
  334. -webkit-animation-timing-function: ease-in;
  335. animation-timing-function: ease-in;
  336. }
  337. 45% {
  338. -webkit-transform: scale(1);
  339. transform: scale(1);
  340. -webkit-animation-timing-function: ease-out;
  341. animation-timing-function: ease-out;
  342. }
  343. }
  344. @keyframes heartbeat {
  345. from {
  346. -webkit-transform: scale(1);
  347. transform: scale(1);
  348. -webkit-transform-origin: center center;
  349. transform-origin: center center;
  350. -webkit-animation-timing-function: ease-out;
  351. animation-timing-function: ease-out;
  352. }
  353. 10% {
  354. -webkit-transform: scale(0.91);
  355. transform: scale(0.91);
  356. -webkit-animation-timing-function: ease-in;
  357. animation-timing-function: ease-in;
  358. }
  359. 17% {
  360. -webkit-transform: scale(0.98);
  361. transform: scale(0.98);
  362. -webkit-animation-timing-function: ease-out;
  363. animation-timing-function: ease-out;
  364. }
  365. 33% {
  366. -webkit-transform: scale(0.87);
  367. transform: scale(0.87);
  368. -webkit-animation-timing-function: ease-in;
  369. animation-timing-function: ease-in;
  370. }
  371. 45% {
  372. -webkit-transform: scale(1);
  373. transform: scale(1);
  374. -webkit-animation-timing-function: ease-out;
  375. animation-timing-function: ease-out;
  376. }
  377. }
  378.  
  379.  
  380. i{color: #111;}
  381. b{color: #000;}
  382. a{color: #444; text-decoration: none;}
  383. h1{border-bottom: 1px solid #000; text-align: center; font-size: 30px; font-family: 'Parisienne', cursive; color: #000;}
  384. </style>
  385. <div id="editthis"><div id="music1"><div id="music2">
  386. <img src="http://38.media.tumblr.com/tumblr_m7w2py1dEP1r6o8v2.gif" style="opacity: 0.8;"></div>
  387. <div id="music3"><Div style="margin-top:4px;">
  388. <audio controls style="opacity: 0;"><source src="http://k007.kiwi6.com/hotlink/p2a9lezg8h/Panic_Room_-_AuRa_lyricslyric_video_.mp3"></audio>
  389. </div></div></div></div>
  390.  
  391. <div id="subwoofer1"></div>
  392.  
  393. <div class="name">Katsumi</div>
  394. <div class="title">Katsumi</div>
  395. <div class="alias">The Siren of 2-A</div>
  396.  
  397. <div id="image"></div>
  398.  
  399. <div id="nav">
  400. <a href="#two"></a>
  401. <a href="#three"></a>
  402. </div>
  403.  
  404. <div id="stats">
  405. <div style="width: 30vw; height: 15vw; overflow-y: hidden;">
  406.  
  407. <a name="one"></a>
  408. <div style="width: 30vw; height: 15vw; overflow: auto;" align="center">
  409. <span style="float:left;"><b>Name</b></span><span style="float:right;"></span><br>
  410. <span style="float:left;"><b>Alias(es)</b></span><span style="float:right;"></span><br>
  411. <span style="float:left;"><b>Gender</b></span><span style="float:right;">Female</span><br>
  412. <span style="float:left;"><b>Age</b></span><span style="float:right;"></span><br>
  413. <span style="float:left;"><b>Race</b></span><span style="float:right;">Human</span><br>
  414. <span style="float:left;"><b>Class</b></span><span style="float:right;"></span><br><br>
  415. <span style="float:left;"><b>Height</b></span><span style="float:right;"></span><br>
  416. <span style="float:left;"><b>Blood Type</b></span><span style="float:right;"></span><br>
  417. <span style="float:left;"><b>Eyes</b></span><span style="float:right;"></span><br>
  418. <span style="float:left;"><b>Hair</b></span><span style="float:right;"></span><br><br>
  419. <span style="float:left;"><b>Orientation</b></span><span style="float:right;"></span><br>
  420. <span style="float:left;"><b>Relationship</b></span><span style="float:right;">Single</span><br><br>
  421. <span style="float:left;"><b>Fighting Style</b></span><span style="float:right;"></span><br><br>
  422. <span style="float:left;"><b>Affiliation</b></span><span style="float:right;">U.A.</span>
  423. </div>
  424. </div>
  425. </div>
  426.  
  427. <div id="friends">
  428. <div style="width: 40vw; height: 15vw; overflow-y: hidden;">
  429.  
  430. <a name="two"></a>
  431. <div style="width: 40vw; height: 15vw; overflow: auto;" align="center">
  432. <h1>Combat</h1>
  433. </div>
  434.  
  435. <a name="three"></a>
  436. <div style="width: 40vw; height: 15vw; overflow: auto;" align="center">
  437. <h1>Friends</h1>
  438. <a target="_blank" href="PROFILE LINK HERE"><img src="https://cdn2.iconfinder.com/data/icons/gaming-and-beyond-part-2-1/80/User_gray-512.png" height="70" width="70" align="left" border="5" title="WORDS"></a>
  439. </div>
  440. </div>
  441. </div>
  442.  
  443. <div id="ooc">
  444. <div style="width: 20vw; height: 11.5vw; overflow-y: hidden;">
  445.  
  446. <a name="one"></a>
  447. <div style="width: 20vw; height: 11.5vw; overflow: auto;" align="left">
  448. <h1>OOC</h1>
  449. <center><b>00</b>. Code made by <a href="/profile.php?user=RageQxeen" target="_blank">RageQxeen</a>, do not steal.<br><br></center>
  450. <b>01</b>. Don't be an asshole.<br>
  451. <b>02</b>. DMs are not for you to send your copy-paste starter post tryna smut, they're for conversing first and foremost with the writer, do not send me a starter post randomly as you will be instantly blocked.<br>
  452. <b>03</b>. IRL takes prescendence over RP.<br>
  453. <b>04</b>. MHA OC, can branch out if the desire hits.<br>
  454. <b>05</b>. I retain the right to deny any RP i desire at any time, as you may do the same.<br>
  455. <b>06</b>. Smut is solely for DMs only and will not actually occur in canon with the room.<br>
  456. <b>07</b>. Don't bitch and complain if I deny your request for smut, you just look like a fuckboi and you'll be blocked.<br>
  457. </div>
  458. </div>
  459. </div>
  460. </body>
  461. </html>
Add Comment
Please, Sign In to add comment