This week only. Pastebin PRO Accounts Christmas Special! Don't miss out!Want more features on Pastebin? Sign Up, it's FREE!
Guest

Untitled

By: a guest on Jan 20th, 2013  |  syntax: None  |  size: 1.87 KB  |  views: 18  |  expires: Never
download  |  raw  |  embed  |  report abuse  |  print
Text below is selected. Please press Ctrl+C to copy to your clipboard. (⌘+C on Mac)
  1. <script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
  2.  
  3. <script type="text/javascript">
  4.    $(document).ready(function () {
  5.       console.log('DOM READY');
  6.  
  7.       $('#me').mouseover(function () {
  8.          $('.hidden').fadeIn(1000);
  9.       });
  10.  
  11.       $('#me').mouseout(function () {
  12.          $('.hidden').fadeOut(1000);
  13.       });
  14.  
  15.    });
  16. </script>
  17.        
  18. <!DOCTYPE HTML>    
  19. <html>
  20.    <head>
  21.       <title>DominikBiedebach - Web- und Printdesigner</title>
  22.       <style type="text/css">
  23.          @import url(http://fonts.googleapis.com/css?family=Open+Sans:400,700|Open+Sans+Condensed:300,700);
  24.  
  25.          html, body { background:  #f4f4f4; color: #202020; }
  26.          div#me{
  27.             background: url(images/me.png) no-repeat;
  28.             height:  256px;
  29.             width: 256px;
  30.             margin: 40px auto 10px auto;
  31.             position: relative;
  32.          }
  33.          div#container{
  34.             width: 960px;
  35.             margin: 0px auto;
  36.             text-align: center;
  37.          }
  38.          h1 {
  39.             font-size: 100px;
  40.             font-family: 'Open Sans Condensed', Arial, Helvetica, sans-serif;
  41.             margin: 0px;
  42.          }
  43.          h3 {
  44.             font-family: 'Open Sans', Arial, Helvetica, sans-serif;
  45.             font-size: 30px;
  46.             line-height: 26px;
  47.             text-transform: uppercase;
  48.          }
  49.  
  50.          .hidden { display: none; }
  51.          #music {
  52.             position: absolute;
  53.             left: -200px;
  54.             width: 200px;
  55.             height: 400px;
  56.          }
  57.  
  58.       </style>
  59.    </head>
  60.    <body>
  61.       <div id="container">
  62.          <div id="me">
  63.             <div class="hidden" id="music">Testbox</div>
  64.             <div class="hidden" id="webdesign">Testbox</div>
  65.          </div>
  66.  
  67.          <h1>xxxx</h1>
  68.          <h3>xxxx</h3>
  69.       </div>
  70.    </body>
  71. </html>
  72.        
  73. $('#me').hover(function() {
  74.     $('.hidden', this).fadeToggle(1000);
  75. });
clone this paste RAW Paste Data