RageQxeen

The Future King

May 9th, 2020
84
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 10.75 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|Cinzel+Decorative|Lora);
  50.  
  51. html, body {
  52. background-color: #0b254a;
  53. background-image: url("https://www.freepngimg.com/thumb/light/78534-and-star-light-wallpaper-sky-black-white.png");
  54. background-position: top;
  55. background-size: fill;
  56. background-repeat: no-repeat;
  57. }
  58.  
  59. ::-webkit-scrollbar-button:vertical:{
  60. background-color: #transparent;}
  61.  
  62. ::-webkit-scrollbar-thumb:vertical {
  63. background-color:#transparent;
  64. height:125px;}
  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: 20vw;
  78. margin: 0px;
  79. border: none;
  80. height: 40vw;
  81. background-color:transparent;
  82. position: absolute;
  83. left: 0vw;
  84. bottom: -1vw;
  85. background-image:url("http://i.picpar.com/cHye.png");
  86. background-repeat:no-repeat;
  87. background-position: bottom;
  88. background-size: 100%;
  89. }
  90.  
  91. #icon {
  92. width: 125px;
  93. margin: 0px;
  94. border: 5px solid #000;
  95. height: 125px;
  96. background-color: #000;
  97. position: absolute;
  98. left: 0vw;
  99. top: -3vw;
  100. background-image:url("http://i.picpar.com/GGye.png");
  101. background-repeat:no-repeat;
  102. background-position: top;
  103. background-size: cover;
  104. z-index: 3;
  105. }
  106.  
  107. #icon2 {
  108. width: 125px;
  109. margin: 0px;
  110. border: 5px solid #000;
  111. height: 125px;
  112. background-color: #000;
  113. position: absolute;
  114. left: 11vw;
  115. top: -3vw;
  116. background-image:url("http://i.picpar.com/NGye.png");
  117. background-repeat:no-repeat;
  118. background-position: top;
  119. background-size: cover;
  120. z-index: 3;
  121. }
  122.  
  123. #icon3 {
  124. width: 125px;
  125. margin: 0px;
  126. border: 5px solid #000;
  127. height: 125px;
  128. background-color: #000;
  129. position: absolute;
  130. left: 23vw;
  131. top: -3vw;
  132. background-image:url("http://i.picpar.com/aHye.jpg");
  133. background-repeat:no-repeat;
  134. background-position: top;
  135. background-size: cover;
  136. z-index: 3;
  137. }
  138.  
  139. #icon4 {
  140. width: 125px;
  141. margin: 0px;
  142. border: 5px solid #000;
  143. height: 125px;
  144. background-color: #000;
  145. position: absolute;
  146. left: 34vw;
  147. top: -3vw;
  148. background-image:url("http://i.picpar.com/YGye.png");
  149. background-repeat:no-repeat;
  150. background-position: top;
  151. background-size: cover;
  152. z-index: 3;
  153. }
  154.  
  155. #icon5 {
  156. width: 125px;
  157. margin: 0px;
  158. border: 5px solid #000;
  159. height: 125px;
  160. background-color: #000;
  161. position: absolute;
  162. left: 45vw;
  163. top: -3vw;
  164. background-image:url("http://i.picpar.com/XGye.png");
  165. background-repeat:no-repeat;
  166. background-position: top;
  167. background-size: cover;
  168. z-index: 3;
  169. }
  170.  
  171. #line1{
  172. background-color: #000;
  173. width: 50vw;
  174. height: .7vw;
  175. margin: auto;
  176. padding: 5px;
  177. position: absolute;
  178. left: 23vw;
  179. bottom: 3.2vw;
  180. z-index: 2;
  181. }
  182.  
  183. #container {
  184. background-color: #49111C;
  185. width: 70vw;
  186. height: 30vw;
  187. margin:auto;
  188. position: absolute;
  189. padding: 5px;
  190. left: 15vw;
  191. bottom: 8vw;
  192. box-shadow: 0px 5px 10px #000;
  193. z-index:2;
  194. background-image:url("https://66.media.tumblr.com/59ab7478bb586b6500e2ae6319b452a2/tumblr_mp2b0zsD0P1s39gbxo1_500.gif");
  195. background-repeat: repeat;
  196. background-position: center;
  197. background-size: cover;
  198. z-index: 2;
  199. }
  200.  
  201. #backcontainer {
  202. background-color: #49111C;
  203. width: 99%;
  204. height: 20vw;
  205. margin:auto;
  206. position: absolute;
  207. padding: 5px;
  208. left: 0vw;
  209. bottom: 13vw;
  210. box-shadow: 0px 5px 10px #000;
  211. z-index:2;
  212. background-image:url("https://66.media.tumblr.com/59ab7478bb586b6500e2ae6319b452a2/tumblr_mp2b0zsD0P1s39gbxo1_500.gif");
  213. background-repeat: repeat;
  214. background-position: bottom;
  215. background-size: cover;
  216. z-index: 1;
  217. }
  218.  
  219. #content {
  220. background-color:#c0c0c0;
  221. width: 53vw;
  222. height: 29vw;
  223. margin:auto;
  224. position: absolute;
  225. padding: 5px;
  226. opacity: 0.8;
  227. font-family: 'Lora', cursive;
  228. font-size: 18px;
  229. color: #000;
  230. right: 1vw;
  231. bottom: .5vw;
  232. z-index: 99;
  233. border: #000000 solid 2px;
  234. }
  235.  
  236. #nav {
  237. background-color: transparent;
  238. width: 1vw;
  239. height: 8vw;
  240. margin:auto;
  241. position: absolute;
  242. right: -1vw;
  243. bottom: 9vw;
  244. text-align:right;
  245. z-index: 99;
  246. }
  247.  
  248. #nav a, #nav a:link, #nav a:visited {
  249. display:inline-block;
  250. height: .8vw;
  251. width: .8vw;
  252. text-decoration:none;
  253. background: #0b254a;
  254. margin: 5px;
  255. border: double #000 5px;
  256. border-radius: 50%;
  257. -webkit-transition: 0.5s linear;
  258. -moz-transition: 0.5s linear;
  259. -o-transition: 0.5s linear;
  260. transition: 0.5s linear;
  261. }
  262.  
  263. #nav a:active, #nav a:hover {
  264. display:inline-block;
  265. height: .8vw;
  266. width: .8vw;
  267. text-decoration:none;
  268. background: #0d7053;
  269. margin: 5px;
  270. border: double #000 5px;
  271. border-radius: 50%;
  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. #nav2 {
  279. background-color: transparent;
  280. width: 1vw;
  281. height: 8vw;
  282. margin:auto;
  283. position: absolute;
  284. left: -1.8vw;
  285. bottom: 9vw;
  286. text-align:right;
  287. z-index: 99;
  288. }
  289.  
  290. #nav2 a, #nav2 a:link, #nav2 a:visited {
  291. display:inline-block;
  292. height: .8vw;
  293. width: .8vw;
  294. text-decoration:none;
  295. background: #0b254a;
  296. margin: 5px;
  297. border: double #000 5px;
  298. border-radius: 50%;
  299. -webkit-transition: 0.5s linear;
  300. -moz-transition: 0.5s linear;
  301. -o-transition: 0.5s linear;
  302. transition: 0.5s linear;
  303. }
  304.  
  305. #nav2 a:active, #nav2 a:hover {
  306. display:inline-block;
  307. height: .8vw;
  308. width: .8vw;
  309. text-decoration:none;
  310. background: #0d7053;
  311. margin: 5px;
  312. border: double #000 5px;
  313. border-radius: 50%;
  314. -webkit-transition: 0.5s linear;
  315. -moz-transition: 0.5s linear;
  316. -o-transition: 0.5s linear;
  317. transition: 0.5s linear;
  318. }
  319.  
  320.  
  321. .name {position: absolute;
  322. font-family: 'Cinzel Decorative';
  323. color: #fff;
  324. font-size: 4vw;
  325. top: -5vw;
  326. left: 17vw;
  327. width: 55vw;
  328. height: 4.5vw;
  329. position: absolute;
  330. border: 0px solid #000;
  331. text-align: justify;
  332. text-shadow: -1px 0 #c0c0c0, 0 3px #000,3px 0 #000, 0 -1px #c0c0c0;
  333. overflow: auto;
  334. padding:5px 5px 5px 5px;
  335. z-index: 2;}
  336.  
  337. .title { background: transparent;
  338. background:url('https://66.media.tumblr.com/59ab7478bb586b6500e2ae6319b452a2/tumblr_mp2b0zsD0P1s39gbxo1_500.gif') repeat;
  339. background-position: top;
  340. position: absolute;
  341. font-family: 'Cinzel Decorative';
  342. font-size: 4vw;
  343. top: -5vw;
  344. left: 17vw;
  345. width: 55vw;
  346. height: 4.5vw;
  347. position: absolute;
  348. text-align: justify;
  349. padding:5px 5px 5px 5px;
  350. -webkit-text-fill-color: transparent;
  351. -webkit-background-clip: text;
  352. z-index: 3;}
  353.  
  354. i{color: #083068;}
  355. b{color: #000;}
  356. a{color: #246dab; text-decoration: none;}
  357. h1{border-bottom: 1px solid #000; text-align: center; font-size: 30px; font-family: 'Cinzel', cursive; color: #000;}
  358. h2{border-bottom: 1px solid #000; text-align: left; font-size: 20px; font-family: 'Cinzel', cursive; color: #000;}
  359. h3{text-align: right; font-size: 20px; font-family: 'Cinzel', cursive; color: #000;}
  360. </style>
  361. <div id="line1">
  362.  
  363. <div id="icon"></div>
  364. <div id="icon2"></div>
  365. <div id="icon3"></div>
  366. <div id="icon4"></div>
  367. <div id="icon5"></div>
  368. </div>
  369. <div id="backcontainer"></div>
  370.  
  371. <div id="container">
  372. <div id="image"></div>
  373.  
  374. <div class="name">The Future King</div>
  375. <div class="title">The Future King</div>
  376.  
  377. <div id="nav2">
  378. <a href="#one"></a>
  379. <a href="#two"></a>
  380. </div>
  381.  
  382. <div id="nav">
  383. <a href="#three"></a>
  384. <a href="#four"></a>
  385. </div>
  386.  
  387. <div id="content">
  388. <div style="width: 53vw; height: 29vw; overflow-y: hidden;">
  389.  
  390. <a name="one"></a>
  391. <div style="width: 53vw; height: 29vw; overflow: auto;" align="center">
  392. <span style="float:left;"><b>Name</b></span><span style="float:right;"></span><br>
  393. <span style="float:left;"><b>Alias</b></span><span style="float:right;"></span><br>
  394. <span style="float:left;"><b>Gender</b></span><span style="float:right;">Male</span><br>
  395. <span style="float:left;"><b>Age</b></span><span style="float:right;">19</span><br>
  396. <span style="float:left;"><b>Race</b></span><span style="float:right;">Human</span><br>
  397. <span style="float:left;"><b>Voice</b></span><span style="float:right;"><a href="" target="_blank"></a></span><br><br>
  398. <span style="float:left;"><b>Height</b></span><span style="float:right;"></span><br>
  399. <span style="float:left;"><b>Weight</b></span><span style="float:right;"></span><br>
  400. <span style="float:left;"><b>Eyes</b></span><span style="float:right;">Blue</span><br>
  401. <span style="float:left;"><b>Hair</b></span><span style="float:right;">Brown</span><br>
  402. <span style="float:left;"><b>Build</b></span><span style="float:right;">Athletic</span><br><br>
  403. <span style="float:left;"><b>Orientation</b></span><span style="float:right;"></span><br>
  404. <span style="float:left;"><b>Relationship</b></span><span style="float:right;">Arranged to Marry</span><br>
  405. <span style="float:left;"><b>Occupation</b></span><span style="float:right;">Prince</span><br>
  406. <span style="float:left;"><b>Alignment</b></span><span style="float:right;"></span><br><br><br>
  407. </div>
  408.  
  409. <a name="two"></a>
  410. <div style="width: 53vw; height: 29vw; overflow: auto;" align="left">
  411. <h1>Abilities</h1>
  412.  
  413. </div>
  414.  
  415.  
  416. <a name="three"></a>
  417. <div style="width: 53vw; height: 29vw; overflow: auto;" align="center">
  418. <h1>Contacts</h1>
  419. <a target="_blank" href="PROFILE LINK HERE"><img src="IMAGE LINK HERE" height="75" width="75" align="left" border="3"></a><br>
  420. <center><b>- Name -</b><br> <i>foe/friend</i><br> small note.</center><br><br><br><br>
  421. </div>
  422.  
  423. <a name="four"></a>
  424. <div style="width: 53vw; height: 29vw; overflow: auto;" align="left">
  425. <h1>Out of Character</h1>
  426.  
  427. <center><b>00</b>. Code made by <a href="/profile.php?user=RageQxeen" target="_blank">RageQxeen</a>, do not steal. Heavily inspired by her beloved OOC friend, <a href="/profile.php?user=Elliot" target="_blank">Elliot</a>.<br><br></center>
  428. <b>01</b>. OOC.<br>
  429. <b>02</b>. OOC.<br>
  430. <b>03</b>. OOC.<br>
  431. <b>04</b>. OOC.<br>
  432. <b>05</b>. OOC.<br>
  433. </div>
  434. </div>
  435. </div>
  436. </div>
  437. </body>
  438. </html>
Add Comment
Please, Sign In to add comment