[ Index ]

PHP Cross Reference of Drupal 6 (gatewave)

title

Body

[close]

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

   1  <!doctype html>
   2  <html lang="en">
   3  <head>
   4      <title>jQuery UI Effects - toggleClass 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; letter-spacing: 0; 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').toggleClass('newClass', 1000);
  19              return false;
  20          });
  21      });
  22      </script>
  23  </head>
  24  <body>
  25  
  26  <div class="demo">
  27  
  28  <div class="toggler">
  29      <div id="effect" class="newClass ui-corner-all">
  30              Etiam libero neque, luctus a, eleifend nec, semper at, lorem. Sed pede. 
  31      </div>
  32  </div>
  33  
  34  <a href="#" id="button" class="ui-state-default ui-corner-all">Run Effect</a>
  35  
  36  </div><!-- End demo -->
  37  
  38  <div class="demo-description">
  39  
  40  <p>Click the button above to preview the effect.</p>
  41  
  42  </div><!-- End demo-description -->
  43  
  44  </body>
  45  </html>


Generated: Thu Mar 24 11:18:33 2011 Cross-referenced by PHPXref 0.7