API tools faq
paste
Advertisement
Guest User

bottom.html

a guest
Mar 16th, 2010
293
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
CSS 3.85 KB | None | 0 0
raw download clone embed print report
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "w3.org/TR/xhtml1/DTD/�;> <html xmlns="w3.org/1999/xhtml">
  2. <head>
  3. <meta http-equiv="content-type" content="text/html; charset=UTF-8">
  4.  <link rel="stylesheet" type="text/css" href="imageScroller.css">
  5.  <link rel="stylesheet" type="text/css" href="simpleTicker.css">
  6.  <title>Cerebration-2010</title>
  7. </head>
  8. <body style="color: rgb(255, 255, 255); background-color: rgb(0, 0, 0);"
  9. link="#0000ee" alink="#ee0000" vlink="#551a8b">
  10. <div id="outerContainer">
  11. <div id="imageScroller"><br>
  12. <br>
  13. <div id="viewer" class="js-disabled"> <a class="wrapper"
  14. href="http://www.dell.com" title="Dell" target="_blank"><img
  15. class="logo" id="Dell" src="logos/dell.jpg" alt="Dell"></a> <a
  16. class="wrapper" href="http://airtel.in" title="Airtel" target="_blank"><img
  17. class="logo" id="Airtel" src="logos/airtel.jpg" alt="Airtel"></a> <a
  18. class="wrapper" href="http://pepsi.com" title="Pepsi" target="_blank"><img
  19. class="logo" id="pepsi" src="logos/pepsi.jpg" alt="pepsi"></a> <a
  20. class="wrapper" href="http://hp.com" title="HP" target="_blank"><img
  21. class="logo" id="hp" src="logos/hp.jpg" alt="HP"></a> <a
  22. class="wrapper" href="http://suzuki.com" title="Suzuki" target="_blank"><img
  23. class="logo" id="suzuki" src="logos/suzuki.jpg" alt="suzuki"></a></div>
  24. </div>
  25. </div>
  26. <script type="text/javascript"
  27. src="http://jqueryjs.googlecode.com/files/jquery-1.3.2.min.js"></script>
  28. <script type="text/javascript" src="sponsors.js"></script>
  29. <img
  30. style="width: 971px; height: 332px; display: block;
  31.               margin-left: auto;
  32.               margin-right: auto;      
  33.              margin-top: 130px;"
  34. alt="Featured" src="img/box.png"><br>
  35. <div id="tickerContainer">
  36. <dl style="top: 10px; " id="ticker">
  37.  <dt class="heading">Cerebration 2010</dt>
  38.  <dd class="text">Cerebration website launched.</dd>
  39.  <dt class="heading">Registeration Open</dt>
  40.  <dd class="text">Register yourself for the events fast !</dd>
  41.  <dt class="heading">Prelims </dt>
  42.  <dd class="text">Prelims started , checkout <a href="http://www.itmindia.edu/cerebration/events/events.html" targer="_blank">
  43. Events </a>section for details.</dd>
  44.  <dt class="heading">Online Events Coming Soon !</dt>
  45.  <dd class="text">Get geared for the online events section .</dd>
  46.  <dt class="heading">E cell</dt>
  47.  <dd class="text">Student's E-cell launched.</dd>
  48. </dl>
  49. </div>
  50. <script type="text/javascript"
  51. src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
  52. <script type="text/javascript">
  53.       $(function() {
  54.      
  55.         //cache the ticker
  56.         var ticker = $("#ticker");
  57.          
  58.         //wrap dt:dd pairs in divs
  59.         ticker.children().filter("dt").each(function() {
  60.          
  61.           var dt = $(this),
  62.             container = $("<div>");
  63.          
  64.           dt.next().appendTo(container);
  65.           dt.prependTo(container);
  66.          
  67.           container.appendTo(ticker);
  68.         });
  69.                
  70.         //hide the scrollbar
  71.         ticker.css("overflow", "hidden");
  72.        
  73.         //animator function
  74.         function animator(currentItem) {
  75.            
  76.           //work out new anim duration
  77.           var distance = currentItem.height();
  78.             duration = (distance + parseInt(currentItem.css("marginTop"))) / 0.025;
  79.  
  80.           //animate the first child of the ticker
  81.           currentItem.animate({ marginTop: -distance }, duration, "linear", function() {
  82.            
  83.             //move current item to the bottom
  84.             currentItem.appendTo(currentItem.parent()).css("marginTop", 0);
  85.  
  86.             //recurse
  87.             animator(currentItem.parent().children(":first"));
  88.           });
  89.         };
  90.        
  91.         //start the ticker
  92.         animator(ticker.children(":first"));
  93.                
  94.         //set mouseenter
  95.         ticker.mouseenter(function() {
  96.          
  97.           //stop current animation
  98.           ticker.children().stop();
  99.          
  100.         });
  101.        
  102.         //set mouseleave
  103.         ticker.mouseleave(function() {
  104.                  
  105.          //resume animation
  106.           animator(ticker.children(":first"));
  107.          
  108.         });
  109.       });
  110.    </script>
  111. </body>
  112. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement
Public Pastes
Advertisement
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!