PHPXRef 0.7 : Drupal 6 (gatewave) : /sites/all/modules/jquery_ui/jquery.ui/demos/addClass/default.html source

[Summary view] [Print] [Text view]

   1  <!doctype html>
   2  <html lang="en">
   3  <head>
   4      <title>jQuery UI Effects - addClass Demo</title>
   5      <link type="text/css" href="http://jquery-ui.googlecode.com/svn/trunk/themes/base/ui.all.css" rel="stylesheet" />
   6      <script type="text/javascript" src="http://jquery-ui.googlecode.com/svn/trunk/jquery-1.3.2.js"></script>
   7      <script type="text/javascript" src="http://jquery-ui.googlecode.com/svn/trunk/ui/effects.core.js"></script>
   8      <link type="text/css" href="http://jquery-ui.googlecode.com/svn/trunk/demos/demos.css" rel="stylesheet" />
   9      <style type="text/css">
  10          .toggler { width: 500px; height: 200px; position: relative;}
  11          #button { padding: .5em 1em; text-decoration: none; }

  12          #effect {position: relative;  width: 240px;  padding: 1em;  font-size: 1.2em; border: 1px solid #000; background: #eee; color: #333; }

  13          #effect.newClass { text-indent: 40px; letter-spacing: .4em; width: 410px; height: 100px; padding: 30px; margin: 10px; font-size: 1.6em; }

  14      </style>
  15      <script type="text/javascript">
  16      $(function() {
  17          $("#button").click(function() {
  18              $('#effect').addClass('newClass', 1000, callback);
  19              return false;
  20          });
  21          
  22  		function callback(){
  23              setTimeout(function(){
  24                  $('#effect').removeClass('newClass');
  25              }, 1500);
  26          }
  27      });
  28      </script>
  29  </head>
  30  <body>
  31  
  32  <div class="demo">
  33  
  34  <div class="toggler">
  35      <div id="effect" class=" ui-corner-all">
  36              Etiam libero neque, luctus a, eleifend nec, semper at, lorem. Sed pede.
  37      </div>
  38  </div>
  39  
  40  <a href="#" id="button" class="ui-state-default ui-corner-all">Run Effect</a>
  41  
  42  </div><!-- End demo -->
  43  
  44  <div class="demo-description">
  45  
  46  <p>This demo adds a class which animates: text-indent, letter-spacing, width, height, padding, margin, and font-size.</p>
  47  
  48  </div><!-- End demo-description -->
  49  
  50  </body>
  51  </html>

PHP Cross Reference of Drupal 6 (gatewave)

/sites/all/modules/jquery_ui/jquery.ui/demos/addClass/ -> default.html (source)