Advertisement
ravmunken

Homepage

Sep 1st, 2014
277
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 7.28 KB | None | 0 0
  1. 
  2.  
  3.     <!DOCTYPE html>
  4.     <!-- homepage by noha javascript by nullbyte -->
  5.      
  6.     <html>
  7.      
  8.     <head>
  9.      
  10.     <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  11.     <link rel="stylesheet" href="animations.css">
  12.      
  13.     <title>Browser Home</title>
  14.      
  15.     </head>
  16.     <style>
  17.    
  18.     a{
  19.             color:#5d5d5d;
  20.             font-family:"AkzidenzGrotesk";
  21.             font-size:30px;
  22.             text-decoration:none;
  23.             margin-left:5px;
  24.             transition-property: color;
  25.             transition-duration: .1s;
  26.             transition-timing-function: linear;
  27.     }
  28.     body{
  29.             padding-left:10px;
  30.             padding-right:10px;
  31.             font-family:"AkzidenzGrotesk";
  32.             color:#a98d9b;
  33.             font-size:45px;
  34.             background:#3f3f3f;
  35.     }
  36.      
  37.     span{
  38.             margin-left:10px;
  39.             text-family:"Sans";
  40.             text-align: center;
  41.     }
  42.      
  43.     a:hover { color:#a98d9b}
  44.      
  45.     input[type=text] {
  46.             width: 18px;
  47.             padding: 3px;
  48.              font-size:25px;
  49.             right:5px;bottom:5px;
  50.             border: 1px solid #3a3a3a;
  51.             transition-property: all;
  52.             transition-duration: .5s;
  53.             transition-timing-function: ease;
  54.             color: #5d5d5d;
  55.             background-color: #3a3a3a;
  56.             background-position: -2px 5px;
  57.         --  background-image: url('/home/akarin/.homepage/searchicon.png');
  58.             background-repeat: no-repeat;
  59.     }
  60.      
  61.     input[type=text]:hover {
  62.             border-color: #3a3a3a;
  63.             transition-property: all;
  64.             transition-duration: .5s;
  65.             transition-timing-function: ease;
  66.             color: #a98d9b;
  67.             width:230px;
  68.             background-position: 227px 5px;
  69.             padding-right: 20px;
  70.     }
  71.     input[type=text]:focus {
  72.             border-color: #3a3a3a;
  73.             transition-property: all;
  74.             transition-duration: .5s;
  75.             transition-timing-function: ease;
  76.             color: #5d5d5d;
  77.             width:230px;
  78.             background-position: 227px 5px;
  79.             padding-right: 20px;
  80.     }
  81.      
  82.     .boxed {
  83.             border: 0px solid #3f3f3f;
  84.             padding: 5px;
  85.             color: #a98d9b;
  86.             background-color: none;
  87.             width: 900px;
  88.             margin-left: auto;
  89.             margin-right: -600px;
  90.             margin-bottom: 200px;
  91.             position:absolute;
  92.             right: 0%;
  93.         bottom: 0%;
  94.         text-align:right;
  95.             transition-property: all;
  96.             transition-duration: .5s;
  97.             transition-timing-function: ease;
  98.         position: fixed;
  99.         overflow-y: hidden;
  100.         overflow-x: hidden;
  101.     }
  102.  
  103.     .boxed:hover {
  104.             border: 0px solid #3f3f3f;
  105.             padding: 5px;
  106.             color: #a98d9b;
  107.             background-color: none;
  108.             width: 900px;
  109.             margin-left: auto;
  110.             margin-right: 0px;
  111.         padding-right:40px;
  112.             margin-bottom: 200px;
  113.             position:absolute;
  114.             right: 0%;
  115.         bottom: 0%;
  116.         text-align:right;
  117.             transition-property: all;
  118.             transition-duration: .5s;
  119.             transition-timing-function: ease;
  120.             background-position: 227px 0px;
  121.         position: fixed;
  122.         overflow-y: hidden;
  123.         overflow-x: hidden;
  124.     }
  125.  
  126.     .boxed:focus {
  127.             border: 0px solid #3f3f3f;
  128.             padding: 5px;
  129.             color: #a98d9b;
  130.             background-color: none;
  131.             width: 900px;
  132.             margin-left: auto;
  133.             margin-right: 0px;
  134.         padding-right:40px;
  135.             margin-bottom: 200px;
  136.             position:absolute;
  137.             right: 0%;
  138.         bottom: 0%;
  139.         text-align:right;
  140.             transition-property: all;
  141.             transition-duration: .5s;
  142.             transition-timing-function: ease;
  143.             background-position: 227px 0px;
  144.         position: fixed;
  145.         overflow-y: hidden;
  146.         overflow-x: hidden;
  147.     }
  148.  
  149.      
  150.     h1 {
  151.           padding-bottom: -600px;
  152.           position: absolute;
  153.           visibility: hidden;
  154.           margin-top: -200px;
  155.           margin-left: -745px;
  156.           left: 100%;
  157.           top: 100%;
  158.         position: fixed;
  159.         overflow-y: hidden;
  160.         overflow-x: hidden;
  161.          
  162.     }
  163.  
  164.      
  165.     </style>
  166.             <body>
  167.             <h1 align="right" id="message" class="expandUp"></h1>
  168.                 <script type="text/javascript">
  169.                         var d = new Date();
  170.                         var n = d.getHours();
  171.  
  172.                         if ( n == 23 || n == 0) {
  173.                                 message = "<img src='goodnight.png'></img>";
  174.                         } else if ( n >= 1 && n <= 4 ) {
  175.                                message = "<img src='goodnight.png'></img>";
  176.                         } else if ( n >= 5 && n <= 11 ) {
  177.                                message = "<img src='goodmorning.png'></img>";
  178.                         } else if ( n >= 12 && n <= 17 ) {
  179.                                message = "<img src='goodafternoon.png'></img>";
  180.                         } else if ( n >= 18 && n <= 22 ) {
  181.                                message = "<img src='goodevening.png'></img>";
  182.                         }
  183.  
  184.                         document.getElementById("message").innerHTML = message;
  185.                 </script>
  186.  
  187.  
  188.  
  189.  
  190.             <div class="boxed" class=slideUp>
  191.  
  192.  
  193.             <a style="padding-left:10px" href="http://konachan.com">konachan</a>
  194.             <a href="http://yande.re">yande.re</a>
  195.             <a href="http://4chan.org/w/">yotsuba</a>
  196.             <a href="http://zerochan.net">zerochan</a>
  197.             </br>
  198.  
  199.             <a style="padding-left:10px" href="http://tumblr.com">tumblr</a>
  200.             <a href="http://github.com/yurisuika">git</a>
  201.             <a href="http://steamcommunity.com/id/yurisuika/home">steam</a>
  202.             <a href="http://somethingawful.com">somethingawful</a>
  203.            
  204.             </br>
  205.  
  206.             <a style="padding-left:10px" href="http://deviantart.com/messages">deviantart</a>
  207.         <a href="http://discogs.com">discogs</a>
  208.             <a href="http://bandcamp.com">bandcamp</a>
  209.  
  210.             </br>
  211.  
  212.             <a style="padding-left:10px" href="http://mail.google.com">post</a>
  213.             <a href="https://my.cl.ly">cloud</a>
  214.             <a href="http://images.google.com/">image</a>
  215.             <a href="http://translate.google.com">translate</a>
  216.             </br>
  217.  
  218.  
  219.         <a style="padding-left:10px" href="http://bakabt.me/browse.php">bakabt</a>
  220.         <a href="http://nyaa.eu">nyaa</a>
  221.         <a href="http://commiesubs.com">commie</a>
  222.         <a href="http://g.e-hentai.org">g.e</a>
  223.         </br>
  224.  
  225.  
  226.             <a style="padding-left:10px" href="http://vimeo.com">vimeo</a>
  227.             <a href="http://youtube.com/feed/subscriptions">youtube</a>
  228.             <a href="http://twitch.tv/directory/following">twitch</a>
  229.  
  230.  
  231.         <form method="get" action="http://www.google.com/search"> <input type="text" placeholder="" value=""
  232.            name="q" autocomplete="off">
  233.            
  234.             </div>  
  235.  
  236.      
  237.      <script>
  238.     $(window).scroll(function() {
  239.         $('#animatedElement').each(function(){
  240.         var imagePos = $(this).offset().top;
  241.  
  242.         var topOfWindow = $(window).scrollTop();
  243.             if (imagePos < topOfWindow+400) {
  244.                 $(this).addClass("slideUp");
  245.             }
  246.         });
  247.     });
  248. </script>
  249.  
  250.  
  251.     </body>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement