Advertisement
RageQxeen

Naoki-onii-chan

Nov 18th, 2022 (edited)
67
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 11.83 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("Feck off.");
  42. window.event.returnValue = false;
  43. });
  44. }
  45. };
  46. </script>
  47.  
  48. <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
  49. <script>
  50. $(document).ready(function(){
  51. $("#image").click(function(){
  52. $("#image").animate({right: "15vw",}, 'slow');
  53. });
  54. });
  55. $(document).ready(function(){
  56. $("#image").click(function(){
  57. $(".indicator").animate({opacity: "0",}, 'slow');
  58. });
  59. });
  60. $(document).ready(function(){
  61. $("#image").click(function(){
  62. $("#friendbox").animate({opacity: "1",}, 'slow');
  63. });
  64. });
  65. $(document).ready(function(){
  66. $("#image").click(function(){
  67. $("#basicbox").animate({opacity: "1",}, 'slow');
  68. });
  69. });
  70. $(document).ready(function(){
  71. $("#image").click(function(){
  72. $("#otherbox").animate({opacity: "1",}, 'slow');
  73. });
  74. });
  75. $(document).ready(function(){
  76. $("#image").click(function(){
  77. $("#nav").animate({opacity: "1",}, 'slow');
  78. });
  79. });
  80. $(document).ready(function(){
  81. $("#image").click(function(){
  82. $(".alias").animate({opacity: "1",}, 'slow');
  83. });
  84. });
  85. $(document).ready(function(){
  86. $("#image").click(function(){
  87. $("#music-bg").animate({opacity: "1",}, 'slow');
  88. });
  89. });
  90. </script>
  91.  
  92. <style type="text/css">
  93.  
  94. @import url(https://fonts.googleapis.com/css?family=Crushed|Cinzel+Decorative);
  95.  
  96. html, body {
  97. background: #1F1C2C; /* fallback for old browsers */
  98. background: -webkit-linear-gradient(to right, #928DAB, #1F1C2C); /* Chrome 10-25, Safari 5.1-6 */
  99. background: linear-gradient(to right, #928DAB, #1F1C2C); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
  100. }
  101.  
  102. ::-webkit-scrollbar-button:vertical:{
  103. background-color: #transparent;}
  104.  
  105. ::-webkit-scrollbar-thumb:vertical {
  106. background-color:#transparent;
  107. height:150px;}
  108.  
  109. ::-webkit-scrollbar-thumb:horizontal {
  110. background-color:#transparent;
  111. height:60px;}
  112.  
  113.  
  114. ::-webkit-scrollbar {
  115. height:60px;
  116. width:5px;
  117. background-color:#transparent;}
  118.  
  119. .cover {
  120. background:url('https://thumbs.gfycat.com/RingedSpicyKodiakbear-size_restricted.gif');
  121. opacity: 0.5;
  122. position: absolute;
  123. width: 100vw;
  124. height: 100vh;
  125. left: 0vw;
  126. top: 0vw;
  127. z-index: 1;
  128. overflow: hidden;
  129. }
  130.  
  131. .indicator {
  132. position: absolute;
  133. font-family: 'Crushed';
  134. font-size: 1.5vw;
  135. color: #000;
  136. top: 1vw;
  137. left: 38vw;
  138. width: 25vw;
  139. height: 3vw;
  140. text-align: center;
  141. overflow: auto;
  142. opacity: 1;
  143. z-index: 11;
  144. }
  145.  
  146. #image {
  147. width: 25vw;
  148. margin: 0px;
  149. height: 40vw;
  150. background-color:transparent;
  151. position: absolute;
  152. right: 37vw;
  153. bottom: 4vw;
  154. background-image:url("https://i.ibb.co/FBg1G2F/3.jpg");
  155. background-repeat:no-repeat;
  156. background-position: bottom;
  157. background-size: 100%;
  158. border-width: 4px;
  159. border-style: solid;
  160. border-image: linear-gradient(to right, #ff00cc, #333399) 1;
  161. z-index: 5;
  162. -webkit-transition: 0.5s linear;
  163. -moz-transition: 0.5s linear;
  164. -o-transition: 0.5s linear;
  165. transition: 0.5s linear;
  166. }
  167.  
  168. #image:hover {
  169. filter: saturate(2);
  170. -webkit-transition: 0.5s linear;
  171. -moz-transition: 0.5s linear;
  172. -o-transition: 0.5s linear;
  173. transition: 0.5s linear;
  174. }
  175.  
  176. #friendbox {
  177. width: 49vw;
  178. height: 10vw;
  179. left: 9vw;
  180. bottom: 33.5vw;
  181. background-color: #000;
  182. position: absolute;
  183. z-index: 2;
  184. border-width: 4px;
  185. border-style: solid;
  186. border-image: linear-gradient(to right, #ff00cc, #333399) 1;
  187. opacity: 0;
  188. }
  189.  
  190. #basicbox {
  191. width: 23vw;
  192. height: 28vw;
  193. left: 9vw;
  194. bottom: 4.5vw;
  195. background-color: #000;
  196. position: absolute;
  197. z-index: 2;
  198. border-width: 4px;
  199. border-style: solid;
  200. border-image: linear-gradient(to right, #ff00cc, #333399) 1;
  201. opacity: 0;
  202. }
  203.  
  204. #otherbox {
  205. width: 23vw;
  206. height: 28vw;
  207. left: 35vw;
  208. bottom: 4.5vw;
  209. background-color: #000;
  210. position: absolute;
  211. z-index: 2;
  212. border-width: 4px;
  213. border-style: solid;
  214. border-image: linear-gradient(to right, #ff00cc, #333399) 1;
  215. opacity: 0;
  216. }
  217.  
  218. #basiccontent {
  219. background-color:transparent;
  220. width: 22vw;
  221. height: 26vw;
  222. margin:auto;
  223. position: absolute;
  224. padding: 5px;
  225. font-family: 'Crushed', cursive;
  226. font-size: 18px;
  227. color: #fff;
  228. left: .5vw;
  229. top: .5vw;
  230. z-index:1;
  231. }
  232.  
  233. #othercontent {
  234. background-color:transparent;
  235. width: 22vw;
  236. height: 26vw;
  237. margin:auto;
  238. position: absolute;
  239. padding: 5px;
  240. font-family: 'Crushed', cursive;
  241. font-size: 18px;
  242. color: #fff;
  243. left: .5vw;
  244. top: .5vw;
  245. z-index:1;
  246. }
  247.  
  248. #nav {
  249. background-color: transparent;
  250. width: 1vw;
  251. height: 10px;
  252. margin:auto;
  253. position: absolute;
  254. left: 33.2vw;
  255. bottom: 21vw;
  256. opacity: 0;
  257. text-align: center;
  258. z-index: 10;
  259. }
  260.  
  261. #nav a, #nav a:link, #nav a:visited {
  262. display:inline-block;
  263. background: #333399;
  264. color: #333399;
  265. margin-top:5px;
  266. margin-bottom: 0px;
  267. margin-left: 0px;
  268. height: 15px;
  269. width: 15px;
  270. border-radius: 100%;
  271. box-shadow: 0px 0px 7px #000;
  272. -webkit-transition: 0.5s linear;
  273. -moz-transition: 0.5s linear;
  274. -o-transition: 0.5s linear;
  275. transition: 0.5s linear;
  276. }
  277.  
  278. #nav a:active, #nav a:hover {
  279. display:inline-block;
  280. height: 15px;
  281. width: 15px;
  282. border-radius: 100%;
  283. text-decoration:none;
  284. background: #ff00cc;
  285. color: #ff00cc;
  286. margin-top: 5px;
  287. box-shadow: 0px 0px 5px #000;
  288. -webkit-transition: 0.5s linear;
  289. -moz-transition: 0.5s linear;
  290. -o-transition: 0.5s linear;
  291. transition: 0.5s linear;
  292. }
  293.  
  294. .alias {position: absolute;
  295. font-family: 'Cinzel Decorative';
  296. background-color: transparent;
  297. background: -webkit-linear-gradient(right, #fc00ff, #00dbde);
  298. -webkit-background-clip: text;
  299. -webkit-text-fill-color: transparent;
  300. font-size: 2.5vw;
  301. bottom: 22vw;
  302. right: 0vw;
  303. width: 28vw;
  304. height: 5vw;
  305. text-align: center;
  306. transform: rotate(90deg);
  307. overflow: auto;
  308. padding:5px 5px 5px 5px;
  309. opacity: 0;
  310. z-index: 3;}
  311.  
  312. #music-bg {
  313. position:absolute;
  314. background-image: url('');
  315. left: 26vw;
  316. top: 1.5vw;
  317. width: 2vw;
  318. height: 1vw;
  319. opacity:0;
  320. -webkit-animation: fade4 2s 6s;
  321. animation: fade4 2s 6s;
  322. -webkit-animation-fill-mode: forwards;
  323. animation-fill-mode: forwards;
  324. z-index: 9999;}
  325.  
  326. #music{
  327. position:absolute;
  328. background-image:
  329. url('https://78.media.tumblr.com/tumblr_m9c8xvWyiH1rto88t.gif%27);
  330. background-color: #000;
  331. background-repeat: no-repeat;
  332. background-size: 40px;
  333. width: 2vw;
  334. height: 1vw;
  335. z-index: 9999;
  336. left:-13.5vw;
  337. top:33.5vh;
  338. overflow:hidden;
  339. -webkit-transition: all 0.5s ease-in-out;
  340. -moz-transition: all 0.5s ease-in-out;
  341. -o-transition: all 0.5s ease-in-out;
  342. }
  343.  
  344. a {text-decoration: none; color: #c0c0c0;}
  345. p {text-indent: 50px; color: #fff; font-size: 30px; text-decoration: bold; line-height: 0;}
  346. h1 {
  347. background: url(https://i.pinimg.com/originals/3c/ee/af/3ceeaf06dabf1a6b390818bcc3f33098.gif);
  348. background-position: left;
  349. background-size:cover;
  350. line-height:1vw;
  351. letter-spacing: 0.2vw;
  352. font-size: 4vh;
  353. font-family: 'Bebas Neue';
  354. text-align: center;
  355. border: .2vh solid #15181F;
  356. border-radius: 10px;
  357. color: #c0c0c0;
  358. filter: drop-shadow(0px 0px 10px #15181F);
  359. text-shadow: 3px 1px 2px #15181F, 0 0 25px #15181F;
  360. margin-top: 1vh;
  361. }
  362. </style>
  363. <div class="cover"></div>
  364.  
  365. <div id="music-bg">
  366. <div id="music">
  367. <audio controls loop="1"><source src="https://audio.jukehost.co.uk/jrwARt01cnaVNcBVuDxCn19W791zxrhi%22%3E">
  368. </audio>
  369. </div></div>
  370.  
  371. <div class="indicator">Click<br>v</div>
  372. <div class="alias"><b>The Outcast Prince</b></div>
  373.  
  374. <div id="nav">
  375. <a href="#two"></a>
  376. <a href="#three"></a>
  377. <a href="#one"></a>
  378. <a href="#four"></a>
  379. <a href="#five"></a>
  380. </div>
  381.  
  382. <div id="image"></div>
  383. <div id="friendbox">
  384. <marquee behavior="scroll" direction="left" onmouseover="this.stop();" onmouseout="this.start();" vspace="30">
  385. <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="120" width="120" align="left" border="5" title="WORDS"></a>
  386. </marquee>
  387. </div>
  388.  
  389. <div id="basicbox">
  390. <div id="basiccontent">
  391. <div style="width: 22vw; height: 26vw; overflow-y: hidden;">
  392.  
  393. <a name="one"></a>
  394. <div style="width: 22vw; height: 26vw; overflow: auto;" align="center">
  395. <span style="float:left;"><b>True Name</b></span><span style="float:right;">Naoki Fushimi</span><br>
  396. <span style="float:left;"><b>Alias(es)</b></span><span style="float:right;"><a title="HERE">hover</a></span><br>
  397. <span style="float:left;"><b>Gender</b></span><span style="float:right;">Male</span><br>
  398. <span style="float:left;"><b>Apparent Age</b></span><span style="float:right;">HERE</span><br><br>
  399. <span style="float:left;"><b>Ethnicity</b></span><span style="float:right;">HERE</span><br>
  400. <span style="float:left;"><b>Orientation</b></span><span style="float:right;">HERE</span><br>
  401. <span style="float:left;"><b>Marital Status</b></span><span style="float:right;">HERE</span><br>
  402. <span style="float:left;"><b>Affiliation</b></span><span style="float:right;">HERE</span><br>
  403. <span style="float:left;"><b>Alignment</b></span><span style="float:right;">HERE</span><br>
  404. <span style="float:left;"><b>Handicaps</b></span><span style="float:right;">HERE</span><br>
  405. <span style="float:left;"><b>Allergies</b></span><span style="float:right;">HERE</span><br><br>
  406. <span style="float:left;"><b>Height</b></span><span style="float:right;">HERE</span><br>
  407. <span style="float:left;"><b>Weight</b></span><span style="float:right;">HERE</span><br>
  408. <span style="float:left;"><b>Body Type</b></span><span style="float:right;">HERE</span><br>
  409. <span style="float:left;"><b>Iris Color</b></span><span style="float:right;">HERE</span><br>
  410. <span style="float:left;"><b>Hair Color</b></span><span style="float:right;">HERE</span><br>
  411. <span style="float:left;"><b>Skin Tone</b></span><span style="float:right;">HERE</span><br>
  412. <span style="float:left;"><b>Dominant Hand</b></span><span style="float:right;">HERE</span>
  413. </div>
  414.  
  415. <a name="two"></a>
  416. <div style="width: 22vw; height: 26vw; overflow: auto;" align="left">
  417. <h1>Abilities</h1>
  418.  
  419. <b>TBA</b>
  420. </div>
  421.  
  422. <a name="three"></a>
  423. <div style="width: 22vw; height: 26vw; overflow: auto;" align="left">
  424. <h1>Inventory</h1>
  425.  
  426. <b>TBA</b>
  427. </div>
  428. </div>
  429. </div>
  430. </div>
  431.  
  432. <div id="otherbox">
  433. <div id="othercontent">
  434. <div style="width: 22vw; height: 26vw; overflow-y: hidden;">
  435. <a name="five"></a>
  436. <div style="width: 22vw; height: 26vw; overflow: auto;" align="left">
  437. <h1>Out of Character</h1>
  438. <center><b>00</b>. Code made by <a href="/profile.php?user=RageQxeen" target="_blank">RageQxeen</a>, do not steal.</center><br><br>
  439. <b>01</b>. OOC.<br>
  440. <b>02</b>. OOC.<br>
  441. <b>03</b>. OOC.<br>
  442. <b>04</b>. OOC.<br>
  443. <b>05</b>. OOC.<br>
  444. </div>
  445.  
  446. <a name="four"></a>
  447. <div style="width: 22vw; height: 26vw; overflow: auto;" align="left">
  448. <h1>History</h1>
  449.  
  450. If you even wanna bother, up to you.
  451. </div>
  452. </div>
  453. </body>
  454. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement