RageQxeen

Silver Sakura

Sep 2nd, 2022
84
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 9.58 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. <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
  48. <script>
  49. $(document).ready(function(){
  50. $("#image").click(function(){
  51. $("#page").fadeOut("slow", 0);
  52. $(this).remove();
  53. });
  54. });
  55. </script>
  56. <style type="text/css">
  57.  
  58. @import url(https://fonts.googleapis.com/css?family=Anybody|Niconne|Cinzel);
  59.  
  60. html, body {
  61. background: #FBD3E9; /* fallback for old browsers */
  62. background: -webkit-linear-gradient(to right, #BB377D, #FBD3E9); /* Chrome 10-25, Safari 5.1-6 */
  63. background: linear-gradient(to right, #BB377D, #FBD3E9); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
  64. }
  65.  
  66. ::-webkit-scrollbar-button:vertical:{
  67. background-color: #transparent;}
  68.  
  69. ::-webkit-scrollbar-thumb:vertical {
  70. background-color:#transparent;
  71. height:150px;}
  72.  
  73. ::-webkit-scrollbar-thumb:horizontal {
  74. background-color:#transparent;
  75. height:60px;}
  76.  
  77.  
  78. ::-webkit-scrollbar {
  79. height:60px;
  80. width:5px;
  81. background-color:#transparent;}
  82.  
  83. .cover {
  84. background:url('https://thumbs.gfycat.com/AssuredAstonishingCanary-size_restricted.gif');
  85. opacity: 0.3;
  86. position: absolute;
  87. width: 100vw;
  88. height: 100vh;
  89. left: 0vw;
  90. top: 0vw;
  91. z-index: 1;
  92. overflow: hidden;
  93. }
  94.  
  95. #page {
  96. background-color: #222;
  97. background-image: url("https://www.itl.cat/pngfile/big/134-1349235_hd-wallpaper-cherry-blossom-painting-mountain.png");
  98. background-size: fill;
  99. background-repeat: no-repeat;
  100. background-position: bottom;
  101. width: 100vw;
  102. height: 99vw;
  103. margin:auto;
  104. position: absolute;
  105. right: 0vw;
  106. bottom: 0vw;
  107. z-index:11;
  108. }
  109.  
  110. #image {
  111. width: 22vw;
  112. margin: 0px;
  113. border: none;
  114. height: 45vw;
  115. background-color:transparent;
  116. position: absolute;
  117. right: 0vw;
  118. bottom: 0vw;
  119. background-image:url("https://i.ibb.co/wNTsQrC/1.png");
  120. background-repeat:no-repeat;
  121. background-position: bottom;
  122. background-size: 100%;
  123. }
  124.  
  125. .alias {position: absolute;
  126. font-family: 'Cinzel';
  127. color: #ffaab7;
  128. font-size: 3vw;
  129. bottom: 25vw;
  130. right: 13vw;
  131. width: 75vw;
  132. height: 8vw;
  133. border: 0px solid #000;
  134. text-align: center;
  135. text-shadow: -1px 0 #000, 0 1px #000,1px 0 #000, 0 -1px #000;
  136. font-weight: bold;
  137. overflow: auto;
  138. padding:5px 5px 5px 5px;
  139. z-index: 7;}
  140.  
  141. #image2 {
  142. width: 30vw;
  143. margin: 0px;
  144. border: none;
  145. height: 45vw;
  146. background-color:transparent;
  147. position: absolute;
  148. right: 0vw;
  149. bottom: 0vw;
  150. background-image:url("https://i.ibb.co/Z2VBV13/4-5.png");
  151. background-repeat:no-repeat;
  152. background-position: bottom;
  153. background-size: 100%;
  154. z-index: 2;
  155. -webkit-animation: bounce;
  156. animation: bounce;
  157. -webkit-animation-duration: 3.5s;
  158. animation-duration: 3.5s;
  159. -webkit-animation-fill-mode: both;
  160. animation-fill-mode: both;
  161. -webkit-animation-timing-function: linear;
  162. animation-timing-function: linear;
  163. animation-iteration-count: infinite;
  164. -webkit-animation-iteration-count: infinite;
  165. }
  166.  
  167. @keyframes bounce{
  168. 0% {bottom: 0px;}
  169. 50% {bottom: 30px;}
  170. 100% {bottom: 0px;}}
  171.  
  172. @-webkit-keyframes bounce {
  173. 0% {bottom: 0px;}
  174. 50% {bottom: 30px;}
  175. 100% {bottom: 0px;}
  176. }
  177.  
  178. #container {
  179. background-color:#69626d;
  180. width:60vw;
  181. height: 35vw;
  182. margin:auto;
  183. position: absolute;
  184. padding: 5px;
  185. left: 10vw;
  186. top: 10vw;
  187. z-index:1;
  188. box-shadow: 0px 5px 10px #000;
  189. background-image: url("https://c4.wallpaperflare.com/wallpaper/962/81/217/fantasy-oriental-boat-cherry-blossom-cherry-tree-hd-wallpaper-preview.jpg");
  190. background-size: cover;
  191. background-position: bottom;
  192. border-radius: 20px;
  193. z-index: 1;
  194. }
  195.  
  196. .name {position: absolute;
  197. font-family: 'Niconne';
  198. color: #fff;
  199. font-size: 6vw;
  200. top: -6vw;
  201. left: 13vw;
  202. width: 40vw;
  203. height: 9vw;
  204. border: 0px solid #000;
  205. text-align: justify;
  206. text-shadow: -1px 0 #c0c0c0, 0 1px #000,1px 0 #000, 0 -1px #c0c0c0;
  207. overflow: auto;
  208. padding:5px 5px 5px 5px;
  209. z-index: 5;}
  210.  
  211. .title { background: transparent;
  212. background:url('https://64.media.tumblr.com/ecd8f3fae5059765e3868c75478b5684/tumblr_nzfixmnJQA1txt22yo1_500.gif') 50px 50px repeat;
  213. background-position: center;
  214. position: absolute;
  215. font-family: 'Niconne';
  216. font-size: 6vw;
  217. top: -6vw;
  218. left: 13vw;
  219. width: 40vw;
  220. height: 9vw;
  221. text-align: justify;
  222. padding:5px 5px 5px 5px;
  223. -webkit-text-fill-color: transparent;
  224. -webkit-background-clip: text;
  225. z-index: 6;}
  226.  
  227. #content {
  228. background-color: rgb(0,0,0,0.8);
  229. width: 50vw;
  230. height: 30vw;
  231. margin:auto;
  232. position: absolute;
  233. padding: 5px;
  234. font-family: 'Anybody', cursive;
  235. font-size: 18px;
  236. color: #fff;
  237. left: 5vw;
  238. top: 3vw;
  239. z-index:1;
  240. border: #000000 solid 2px;
  241. }
  242.  
  243. #nav {
  244. background-color: transparent;
  245. width: 70px;
  246. height: 5px;
  247. margin:auto;
  248. position: absolute;
  249. right: 29vw;
  250. top: 2vw;
  251. text-align: center;
  252. z-index: 7;
  253. }
  254.  
  255. #nav a, #nav a:link, #nav a:visited {
  256. display:inline-block;
  257. background: #332628;
  258. color: #332628;
  259. margin-top: 0px;
  260. margin-bottom: 0px;
  261. margin-left: 0px;
  262. height: 10px;
  263. width: 10px;
  264. border-radius: 100%;
  265. box-shadow: 0px 0px 7px #ffecef;
  266. -webkit-transition: 0.5s linear;
  267. -moz-transition: 0.5s linear;
  268. -o-transition: 0.5s linear;
  269. transition: 0.5s linear;
  270. }
  271.  
  272. #nav a:active, #nav a:hover {
  273. display:inline-block;
  274. height: 10px;
  275. width: 10px;
  276. border-radius: 100%;
  277. text-decoration:none;
  278. background: #ffdfe5;
  279. color: #ffdfe5;
  280. margin: 0px;
  281. box-shadow: 0px 0px 5px #ffecef;
  282. -webkit-transition: 0.5s linear;
  283. -moz-transition: 0.5s linear;
  284. -o-transition: 0.5s linear;
  285. transition: 0.5s linear;
  286. }
  287.  
  288. i{color: #ffb3ff;}
  289. b{color: #ffe6ff;}
  290. a{color: #ff99ff; text-decoration: none;}
  291. h1{border-bottom: 1px solid #ff6699; text-align: center; font-size: 30px; font-family: 'Cinzel', cursive; color: #ff6699;}
  292. </style>
  293. <div id="page">
  294. <div id="image"></div>
  295. <div class="alias">In the cherry blossom's shade there's no such thing as a stranger.</div>
  296. </div>
  297.  
  298.  
  299. <div class="cover"></div>
  300.  
  301. <div id="image2"></div>
  302.  
  303. <div id="container">
  304. <div class="name">Sakura Blossoms</div>
  305. <div class="title">Sakura Blossoms</div>
  306.  
  307. <div id="nav">
  308. <a href="#one"></a>
  309. <a href="#two"></a>
  310. <a href="#three"></a>
  311. <a href="#four"></a>
  312. </div>
  313.  
  314. <div id="content">
  315. <div style="width: 50vw; height: 30vw; overflow-y: hidden;">
  316.  
  317. <a name="one"></a>
  318. <div style="width: 50vw; height: 30vw; overflow: auto;" align="center">
  319. <h1>The Basics</h1>
  320. <span style="float:left;"><b>Name</b></span><span style="float:right;"></span><br>
  321. <span style="float:left;"><b>Alias(es)</b></span><span style="float:right;"></span><br>
  322. <span style="float:left;"><b>Gender</b></span><span style="float:right;"></span><br>
  323. <span style="float:left;"><b>Age</b></span><span style="float:right;"></span><br>
  324. <span style="float:left;"><b>Height</b></span><span style="float:right;"></span><br>
  325. <span style="float:left;"><b>Weight</b></span><span style="float:right;"></span><br><br>
  326. <span style="float:left;"><b>Orientation</b></span><span style="float:right;"></span><br>
  327. <span style="float:left;"><b>Relationship</b></span><span style="float:right;"></span><br>
  328. <span style="float:left;"><b>Race</b></span><span style="float:right;"></span><br>
  329. <span style="float:left;"><b>Eyes</b></span><span style="float:right;"></span><br>
  330. <span style="float:left;"><b>Hair</b></span><span style="float:right;"></span><br>
  331. <span style="float:left;"><b>Build</b></span><span style="float:right;"></span><br><br>
  332. <span style="float:left;"><b>Gallery</b></span><span style="float:right;"><a href="https://ibb.co/album/7Jpdps" target="_blank">Here</a></span><br>
  333.  
  334. <h1>Friends</h1>
  335. <marquee behavior="scroll" direction="left" onmouseover="this.stop();" onmouseout="this.start();">
  336. <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>
  337. </marquee>
  338. </div>
  339.  
  340. <a name="two"></a>
  341. <div style="width: 50vw; height: 30vw; overflow: auto;" align="left">
  342. <h1>Abilities</h1>
  343.  
  344. </div>
  345.  
  346.  
  347. <a name="three"></a>
  348. <div style="width: 50vw; height: 30vw; overflow: auto;" align="center">
  349. <h1>History</h1>
  350.  
  351. </div>
  352.  
  353. <a name="four"></a>
  354. <div style="width: 50vw; height: 30vw; overflow: auto;" align="left">
  355. <h1>Out of Character</h1>
  356. <center><b>00</b>. Code made by <a href="https://rageqxeen.neocities.org/vw_codes/rageqxeen.html" target="_blank">RageQxeen</a>, do not steal.</center><br>
  357. <b>01</b>. OOC<br>
  358. <b>02</b>. OOC<br>
  359. <b>03</b>. OOC<br>
  360. <b>04</b>. OOC<br>
  361. <b>05</b>. OOC<br>
  362. </div>
  363. </div>
  364. </div>
  365. </div>
  366. </body>
  367. </html>
Advertisement
Add Comment
Please, Sign In to add comment