Advertisement
RageQxeen

The New Seras

Nov 29th, 2022
45
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 10.25 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.  
  48. <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
  49. <script>
  50. $(document).ready(function(){
  51. $("#christmas").click(function(){
  52. $("#image2").animate({opacity: "1"}, 'slow');
  53. });
  54. });
  55. $(document).ready(function(){
  56. $("#christmas").click(function(){
  57. $("#christmas").animate({opacity: "0"}, 'slow');
  58. });
  59. });
  60. $(document).ready(function(){
  61. $("#christmas").click(function(){
  62. $(".indicator").animate({opacity: "0"}, 'slow');
  63. });
  64. });
  65. $(document).ready(function(){
  66. $("#christmas").click(function(){
  67. $("#container").animate({opacity: "1"}, 'slow');
  68. });
  69. });
  70. $(document).ready(function(){
  71. $("#christmas").click(function(){
  72. $(".alias").animate({opacity: "1"}, 'slow');
  73. });
  74. });
  75. $(document).ready(function(){
  76. $("#image").click(function(){
  77. $("#image").animate({opacity: "0"}, 'slow');
  78. });
  79. });
  80. $(document).ready(function(){
  81. $("#image").click(function(){
  82. $("#image2").animate({opacity: "1"}, 'slow');
  83. });
  84. });
  85. $(document).ready(function(){
  86. $("#image").click(function(){
  87. $(".indicator").animate({opacity: "0"}, 'slow');
  88. });
  89. });
  90. $(document).ready(function(){
  91. $("#image").click(function(){
  92. $("#container").animate({opacity: "1"}, 'slow');
  93. });
  94. });
  95. $(document).ready(function(){
  96. $("#image").click(function(){
  97. $(".alias").animate({opacity: "1"}, 'slow');
  98. });
  99. });
  100. </script>
  101.  
  102. <style type="text/css">
  103.  
  104. @import url(https://fonts.googleapis.com/css?family=Creepster|Merienda|Righteous);
  105.  
  106. html, body {
  107. background: #000000; /* fallback for old browsers */
  108. background: -webkit-linear-gradient(to right, #e74c3c, #000000); /* Chrome 10-25, Safari 5.1-6 */
  109. background: linear-gradient(to right, #e74c3c, #000000); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
  110. }
  111.  
  112. ::-webkit-scrollbar-button:vertical:{
  113. background-color: #transparent;}
  114.  
  115. ::-webkit-scrollbar-thumb:vertical {
  116. background-color:#transparent;
  117. height:150px;}
  118.  
  119. ::-webkit-scrollbar-thumb:horizontal {
  120. background-color:#transparent;
  121. height:60px;}
  122.  
  123.  
  124. ::-webkit-scrollbar {
  125. height:60px;
  126. width:5px;
  127. background-color:#transparent;}
  128.  
  129. #christmas {
  130. width: 25vw;
  131. margin: 0px;
  132. border: none;
  133. height: 50vw;
  134. background-color:transparent;
  135. position: absolute;
  136. left: 10vw;
  137. bottom: 0vw;
  138. background-image:url("https://i.ibb.co/dDBcQtK/3.png");
  139. background-repeat:no-repeat;
  140. background-position: bottom;
  141. background-size: 100%;
  142. z-index: 2;
  143. }
  144. /*
  145. #image {
  146. width: 25vw;
  147. margin: 0px;
  148. border: none;
  149. height: 50vw;
  150. background-color:transparent;
  151. position: absolute;
  152. left: 10vw;
  153. bottom: 0vw;
  154. background-image:url("https://i.ibb.co/vsKxZ7B/1.png");
  155. background-repeat:no-repeat;
  156. background-position: bottom;
  157. background-size: 100%;
  158. z-index: 2;
  159. }
  160. */
  161. #image2 {
  162. width: 33vw;
  163. margin: 0px;
  164. border: none;
  165. height: 50vw;
  166. background-color:transparent;
  167. position: absolute;
  168. right: 8vw;
  169. bottom: 0vw;
  170. background-image:url("https://i.ibb.co/fHRhzFr/2.png");
  171. background-repeat:no-repeat;
  172. background-position: bottom;
  173. background-size: 100%;
  174. transform: scaleX(-1);
  175. opacity: 0;
  176. z-index: 2;
  177. }
  178.  
  179. .indicator {
  180. position: absolute;
  181. font-family: 'Merienda';
  182. font-size: 2vw;
  183. color: #000;
  184. bottom: 15vw;
  185. right: 38vw;
  186. width: 25vw;
  187. height: 20vw;
  188. text-align: center;
  189. overflow: auto;
  190. opacity: 1;
  191. z-index: 11;
  192. }
  193.  
  194. .alias {position: absolute;
  195. font-family: 'Creepster';
  196. background-color: transparent;
  197. background: -webkit-linear-gradient(left, #2c3e50, #fd746c);
  198. -webkit-background-clip: text;
  199. -webkit-text-fill-color: transparent;
  200. font-size: 7vw;
  201. bottom: 35.4vw;
  202. left: 28vw;
  203. width: 40vw;
  204. height: 7vw;
  205. text-align: center;
  206. overflow: auto;
  207. padding:5px 5px 5px 5px;
  208. opacity: 0;
  209. z-index: 3;}
  210.  
  211. #container {
  212. background-color: transparent;
  213. background-image:url("https://cdnb.artstation.com/p/assets/images/images/018/538/343/large/kotarou-sakaguti-vampireblood.jpg?1559752631");
  214. background-repeat:no-repeat;
  215. background-position: bottom;
  216. background-size: cover;
  217. width: 55vw;
  218. height: 32vw;
  219. margin:auto;
  220. position: absolute;
  221. padding: 5px;
  222. right: 25vw;
  223. bottom: 3vw;
  224. opacity: 0;
  225. z-index:1;
  226. box-shadow: 0px 10px 15px #000;
  227. border-left: solid 4px #000;
  228. border-bottom: solid 4px #000;
  229. border-top: solid 4px #000;
  230. }
  231.  
  232. #content {
  233. background-color: rgb(0, 0, 0, 0.5);
  234. width: 45vw;
  235. height: 31vw;
  236. margin:auto;
  237. position: absolute;
  238. padding: 10px;
  239. font-family: 'Righteous', cursive;
  240. font-size: 18px;
  241. color: #fff;
  242. left: 0.25vw;
  243. bottom: .25vw;
  244. z-index:1;
  245. }
  246.  
  247. #nav {
  248. background-color: transparent;
  249. width: 75px;
  250. height: 5px;
  251. margin:auto;
  252. position: absolute;
  253. left: 22vw;
  254. bottom: -1vw;
  255. text-align: center;
  256. z-index: 10;
  257. }
  258.  
  259. #nav a, #nav a:link, #nav a:visited {
  260. display:inline-block;
  261. background: #5e5e5e;
  262. color: #5e5e5e;
  263. margin-top: 0px;
  264. margin-bottom: 0px;
  265. margin-left: 0px;
  266. height: 15px;
  267. width: 15px;
  268. border-radius: 100%;
  269. box-shadow: 0px 0px 7px #ffecef;
  270. -webkit-transition: 0.5s linear;
  271. -moz-transition: 0.5s linear;
  272. -o-transition: 0.5s linear;
  273. transition: 0.5s linear;
  274. }
  275.  
  276. #nav a:active, #nav a:hover {
  277. display:inline-block;
  278. height: 15px;
  279. width: 15px;
  280. border-radius: 100%;
  281. text-decoration:none;
  282. background: #6b1218;
  283. color: #6b1218;
  284. margin: 0px;
  285. box-shadow: 0px 0px 5px #ffecef;
  286. -webkit-transition: 0.5s linear;
  287. -moz-transition: 0.5s linear;
  288. -o-transition: 0.5s linear;
  289. transition: 0.5s linear;
  290. }
  291.  
  292. a {text-decoration: none; color: #5e5e5e;}
  293. h1 {
  294. background: url(https://c.tenor.com/cDQN9Jc-mPcAAAAC/sky-red.gif);
  295. background-position: left;
  296. background-size:cover;
  297. line-height:1vw;
  298. letter-spacing: 0.2vw;
  299. font-size: 4vh;
  300. font-family: 'Merienda';
  301. text-align: center;
  302. border: .2vh solid #15181F;
  303. border-radius: 10px;
  304. color: #89253e;
  305. filter: drop-shadow(0px 0px 10px #15181F);
  306. text-shadow: 3px 1px 2px #15181F, 0 0 25px #15181F;
  307. margin-top: 1vh;
  308. }
  309. </style>
  310.  
  311. <div id="christmas"></div>
  312.  
  313. <div id="image"></div>
  314. <div id="image2"></div>
  315.  
  316. <div class="indicator">"It felt like if I drank the blood, it would mean the end of something important inside of me." <br><br><small><s>Click her.</s></small></div>
  317.  
  318. <div class="alias">Draculina</div>
  319. <div id="container">
  320. <div id="nav">
  321. <a href="#one"></a>
  322. <a href="#two"></a>
  323. <a href="#three"></a>
  324. <a href="#four"></a>
  325. </div>
  326.  
  327. <div id="content">
  328. <div style="width: 45vw; height: 31vw; overflow-y: hidden;">
  329.  
  330. <a name="one"></a>
  331. <div style="width: 45vw; height: 31vw; overflow: auto;" align="center">
  332. <h1>The Basics</h1>
  333. <span style="float:left;"><b>True Name</b></span><span style="float:right;">HERE</span><br>
  334. <span style="float:left;"><b>Alias(es)</b></span><span style="float:right;"><a title="HERE">hover</a></span><br>
  335. <span style="float:left;"><b>Gender</b></span><span style="float:right;">HERE</span><br>
  336. <span style="float:left;"><b>Apparent Age</b></span><span style="float:right;">HERE</span><br><br>
  337. <span style="float:left;"><b>Ethnicity</b></span><span style="float:right;">HERE</span><br>
  338. <span style="float:left;"><b>Orientation</b></span><span style="float:right;">HERE</span><br>
  339. <span style="float:left;"><b>Marital Status</b></span><span style="float:right;">HERE</span><br>
  340. <span style="float:left;"><b>Affiliation</b></span><span style="float:right;">HERE</span><br>
  341. <span style="float:left;"><b>Alignment</b></span><span style="float:right;">HERE</span><br>
  342. <span style="float:left;"><b>Handicaps</b></span><span style="float:right;">HERE</span><br>
  343. <span style="float:left;"><b>Allergies</b></span><span style="float:right;">HERE</span><br><br>
  344. <span style="float:left;"><b>Height</b></span><span style="float:right;">HERE</span><br>
  345. <span style="float:left;"><b>Weight</b></span><span style="float:right;">HERE</span><br>
  346. <span style="float:left;"><b>Body Type</b></span><span style="float:right;">HERE</span><br>
  347. <span style="float:left;"><b>Iris Color</b></span><span style="float:right;">HERE</span><br>
  348. <span style="float:left;"><b>Hair Color</b></span><span style="float:right;">HERE</span><br>
  349. <span style="float:left;"><b>Skin Tone</b></span><span style="float:right;">HERE</span><br>
  350. <span style="float:left;"><b>Dominant Hand</b></span><span style="float:right;">HERE</span><br><br>
  351. <span style="float:left;"><b>Album</b></span><span style="float:right;"><a href="https://ibb.co/album/LvVbMq" target="_blank">Click</a>.</span>
  352. </div>
  353.  
  354. <a name="two"></a>
  355. <div style="width: 45vw; height: 31vw; overflow: auto;" align="left">
  356. <h1>Abilities</h1>
  357.  
  358. </div>
  359.  
  360.  
  361. <a name="three"></a>
  362. <div style="width: 45vw; height: 31vw; overflow: auto;" align="left">
  363. <h1>History</h1>
  364.  
  365. </div>
  366.  
  367. <a name="four"></a>
  368. <div style="width: 45vw; height: 31vw; overflow: auto;" align="left">
  369. <h1>Out of Character</h1>
  370. <center><b>00</b>. Code made by <a target="_blank" href="https://rageqxeen.neocities.org/vw_codes/rageqxeen.html">RageQxeen</a>, do not steal. Art is credited to the artist <a href="https://twitter.com/henken_second" target="_blank">Henken</a>.</center><br>
  371. <b>01</b>. OOC<br>
  372. <b>02</b>. OOC<br>
  373. <b>03</b>. OOC<br>
  374. <b>04</b>. OOC<br>
  375. <b>05</b>. OOC<br>
  376. </div>
  377. </div>
  378. </div>
  379. </div>
  380. </body>
  381. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement