Advertisement
RageQxeen

Akio

Jan 24th, 2020
125
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 9.41 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+Decorative|Aref+Ruqaa);
  50.  
  51. html, body {
  52. background: #9370DB;
  53. background-image:url("http://i.picpar.com/N4Yd.png");
  54. background-size:600px;
  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: 45vw;
  81. background-color:transparent;
  82. position: absolute;
  83. right: 1vw;
  84. bottom: 0vw;
  85. background-image:url("http://i.picpar.com/P4Yd.png");
  86. background-repeat:no-repeat;
  87. background-position: bottom;
  88. background-size: 100%;
  89. z-index: 0;
  90. }
  91.  
  92. #container {
  93. background: rgb(161,93,234);
  94. background: -moz-linear-gradient(180deg, rgba(161,93,234,1) 0%, rgba(177,51,201,1) 25%, rgba(125,1,133,1) 50%, rgba(133,63,141,1) 75%, rgba(137,119,219,1) 100%);
  95. background: -webkit-linear-gradient(180deg, rgba(161,93,234,1) 0%, rgba(177,51,201,1) 25%, rgba(125,1,133,1) 50%, rgba(133,63,141,1) 75%, rgba(137,119,219,1) 100%);
  96. background: linear-gradient(180deg, rgba(161,93,234,1) 0%, rgba(177,51,201,1) 25%, rgba(125,1,133,1) 50%, rgba(133,63,141,1) 75%, rgba(137,119,219,1) 100%);
  97. filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#a15dea",endColorstr="#8977db",GradientType=1);width: 60vw;
  98. height: 38vw;
  99. margin:auto;
  100. position: absolute;
  101. padding: 5px;
  102. left: 10vw;
  103. top: 10vw;
  104. z-index: 0;
  105. border: 4px dotted #000;
  106. }
  107.  
  108. #content {
  109. background-color:#f8f8ff;
  110. width: 55vw;
  111. height: 35vw;
  112. margin:auto;
  113. position: absolute;
  114. padding: 5px;
  115. font-family: 'Aref Ruqaa', cursive;
  116. font-size: 18px;
  117. color: #000;
  118. left: 1vw;
  119. bottom: 0.5vw;
  120. z-index:6;
  121. border: 5px double #000;
  122. }
  123.  
  124. #nav {
  125. background-color: transparent;
  126. width: 2vw;
  127. height: 1.7vw;
  128. margin:auto;
  129. position: absolute;
  130. right: 3vw;
  131. top: 3vw;
  132. text-align:right;
  133. z-index:5;
  134. }
  135.  
  136. #nav a, #nav a:link, #nav a:visited {
  137. display:inline-block;
  138. height: .5vw;
  139. width: 3vw;
  140. text-decoration:none;
  141. background: #f8f8ff;
  142. margin: 5px;
  143. border: double #000 5px;
  144. -webkit-transition: 0.5s linear;
  145. -moz-transition: 0.5s linear;
  146. -o-transition: 0.5s linear;
  147. transition: 0.5s linear;
  148. z-index:5;
  149. }
  150.  
  151. #nav a:active, #nav a:hover {
  152. display:inline-block;
  153. height: .5vw;
  154. width: 3vw;
  155. text-decoration:none;
  156. background: #7d0185;
  157. margin: 5px;
  158. border: double #000 5px;
  159. -webkit-transition: 0.5s linear;
  160. -moz-transition: 0.5s linear;
  161. -o-transition: 0.5s linear;
  162. transition: 0.5s linear;
  163. z-index:5;
  164. }
  165.  
  166. .name {position: absolute;
  167. font-family: 'Cinzel Decorative';
  168. color: #fff;
  169. font-size: 6vw;
  170. top: -6.2vw;
  171. left: -1vw;
  172. width: 27vw;
  173. height: 9vw;
  174. border: 0px solid #000;
  175. text-align: justify;
  176. text-shadow: -1px 0 #c0c0c0, 0 1px #000,1px 0 #000, 0 -1px #c0c0c0;
  177. overflow: auto;
  178. padding:5px 5px 5px 5px;
  179. z-index: 2;}
  180.  
  181. .title { background: transparent;
  182. background:url('https://media.giphy.com/media/l378zgJ4WzWxNZlni/giphy.gif') repeat;
  183. background-position: center;
  184. position: absolute;
  185. font-family: 'Cinzel Decorative';
  186. font-size: 6vw;
  187. top: -6.2vw;
  188. left: -1vw;
  189. width: 27vw;
  190. height: 9vw;
  191. text-align: justify;
  192. padding:5px 5px 5px 5px;
  193. -webkit-text-fill-color: transparent;
  194. -webkit-background-clip: text;
  195. z-index: 3;}
  196.  
  197. .alias {position: absolute;
  198. font-family: 'Aref Ruqaa';
  199. color: #800080;
  200. font-size: 2vw;
  201. top: -1vw;
  202. left: 2.3vw;
  203. width: 18vw;
  204. height: 2.8vw;
  205. border: 0px solid #000;
  206. text-align: center;
  207. text-shadow: -1px 0 #c0c0c0, 0 1px #000,1px 0 #000, 0 -1px #c0c0c0;
  208. overflow: auto;
  209. padding:5px 5px 5px 5px;
  210. z-index: 7;}
  211.  
  212. i{color: #660000;}
  213. b{color: #000;}
  214. a{color: #222; text-decoration: none;}
  215. h1{border-bottom: 1px solid #000; text-align: center; font-size: 30px; font-family: 'Cinzel Decorative', cursive; color: #000;}
  216. h2{border-bottom: 1px solid #000; text-align: left; font-size: 30px; font-family: 'Cinzel Decorative', cursive; color: #000;}
  217. h3{border-bottom: 1px solid #000; text-align: right; font-size: 30px; font-family: 'Cinzel Decorative', cursive; color: #000;}
  218. </style>
  219.  
  220. <div id="image"></div>
  221.  
  222. <div id="container">
  223. <div class="name">Akio</div>
  224. <div class="title">Akio</div>
  225. <div class="alias">TITLE/QUOTE</div>
  226.  
  227. <div id="nav">
  228. <a href="#one"></a>
  229. <a href="#two"></a>
  230. <a href="#three"></a>
  231. <a href="#four"></a>
  232. </div>
  233.  
  234. <div id="content">
  235. <div style="width: 55vw; height: 35vw; overflow-y: hidden;">
  236.  
  237. <a name="one"></a>
  238. <div style="width: 55vw; height: 35vw; overflow: auto;" align="center">
  239. <span style="float:left;"><b>Name</b></span><span style="float:right;"></span><br>
  240. <span style="float:left;"><b>Alias(es)</b></span><span style="float:right;"><a title="">hover</a></span><br>
  241. <span style="float:left;"><b>Gender</b></span><span style="float:right;"></span><br>
  242. <span style="float:left;"><b>Age</b></span><span style="float:right;"></span><br>
  243. <span style="float:left;"><b>Race</b></span><span style="float:right;"></span><br>
  244. <span style="float:left;"><b>Voice</b></span><span style="float:right;"><a href="HERE" target="_blank">Click~</a></span><br><br>
  245. <span style="float:left;"><b>Height</b></span><span style="float:right;"></span><br>
  246. <span style="float:left;"><b>Weight</b></span><span style="float:right;"></span><br>
  247. <span style="float:left;"><b>Eyes</b></span><span style="float:right;"></span><br>
  248. <span style="float:left;"><b>Hair</b></span><span style="float:right;"></span><br>
  249. <span style="float:left;"><b>Build</b></span><span style="float:right;"></span><br><br>
  250. <span style="float:left;"><b>Orientation</b></span><span style="float:right;"></span><br>
  251. <span style="float:left;"><b>Relationship</b></span><span style="float:right;"></span><br>
  252. <span style="float:left;"><b>Affiliation</b></span><span style="float:right;"></span><br><br>
  253. </div>
  254.  
  255. <a name="two"></a>
  256. <div style="width: 55vw; height: 35vw; overflow: auto;" align="left">
  257. <h1>Quirk</h1>
  258. <b>Name Here</b>
  259. <p style="margin-left: 30px;">Description Here</p>
  260.  
  261. <b>Type</b>: <br><br>
  262. <b>Duration</b>: <br><br>
  263. <b>Weaknesses</b>: <br><br>
  264. <b>Drawbacks</b>: <br><br>
  265. <b>Strengths</b>: <br><br>
  266.  
  267. <span style="float:left;"><b>Cooperation</b></span><span style="float:right;">●●○○○</span><br><br>
  268. <span style="float:left;"><b>Power</b></span><span style="float:right;">●●●●○</span><br><br>
  269. <span style="float:left;"><b>Speed</b></span><span style="float:right;">●●●●○</span><br><br>
  270. <span style="float:left;"><b>Intelligence</b></span><span style="float:right;">●●●○○</span><br><br>
  271. <span style="float:left;"><b>Technique</b></span><span style="float:right;">●●●●○</span><br><br>
  272.  
  273. </div>
  274.  
  275. <a name="three"></a>
  276. <div style="width: 55vw; height: 35vw; overflow: auto;" align="left">
  277. <h1>Connections</h1>
  278. <a target="_blank" href="PROFILE LINK HERE"><img src="IMAGE LINK HERE" height="75" width="75" align="left" border="3"></a>
  279. <center><b>- Name -</b><br> <i>foe/friend</i><br> small note.</center><br><br><br><br>
  280. <a target="_blank" href="PROFILE LINK HERE"><img src="IMAGE LINK HERE" height="75" width="75" align="left" border="3"></a>
  281. <center><b>- Name -</b><br> <i>foe/friend</i><br> small note.</center><br><br><br><br>
  282. <a target="_blank" href="PROFILE LINK HERE"><img src="IMAGE LINK HERE" height="75" width="75" align="left" border="3"></a>
  283. <center><b>- Name -</b><br> <i>foe/friend</i><br> small note.</center><br><br><br><br>
  284. <a target="_blank" href="PROFILE LINK HERE"><img src="IMAGE LINK HERE" height="75" width="75" align="left" border="3"></a>
  285. <center><b>- Name -</b><br> <i>foe/friend</i><br> small note.</center>
  286. </div>
  287.  
  288. <a name="four"></a>
  289. <div style="width: 55vw; height: 35vw; overflow: auto;" align="left">
  290. <h1>Out of Character</h1>
  291. <b>00</b>. Code made by <a href="/profile.php?user=RageQxeen" target="_blank">RageQxeen</a>, do not steal.<br><br>
  292. <b>01</b>. OOC.<br><br>
  293. <b>02</b>. OOC.<br><br>
  294. <b>03</b>. OOC.<br><br>
  295. <b>04</b>. OOC.<br><br>
  296. <b>05</b>. OOC.<br><br>
  297. </div>
  298. </div>
  299. </div>
  300. </div>
  301. </body>
  302. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement