Advertisement
RageQxeen

The Wild Child

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