aboutsummaryrefslogtreecommitdiffstats
path: root/demos/effect_methods
diff options
context:
space:
mode:
authorScott Jehl <scott@scottjehl.com>2009-02-26 22:53:46 +0000
committerScott Jehl <scott@scottjehl.com>2009-02-26 22:53:46 +0000
commit6f8399916b772cd012c76845a71154b113853d5b (patch)
tree4ca47ad112b2e647ce555af48e0a125fd43aad13 /demos/effect_methods
parentfd0333b66d5a413624e58a3a4eb4e7b2dfbc0d34 (diff)
downloadjquery-ui-6f8399916b772cd012c76845a71154b113853d5b.tar.gz
jquery-ui-6f8399916b772cd012c76845a71154b113853d5b.zip
added effect method folders / pages
Diffstat (limited to 'demos/effect_methods')
-rw-r--r--demos/effect_methods/animate.html52
-rw-r--r--demos/effect_methods/effect.html49
-rw-r--r--demos/effect_methods/hide.html47
-rw-r--r--demos/effect_methods/show.html49
-rw-r--r--demos/effect_methods/switch-class.html53
-rw-r--r--demos/effect_methods/toggle-class.html48
-rw-r--r--demos/effect_methods/toggle.html46
7 files changed, 0 insertions, 344 deletions
diff --git a/demos/effect_methods/animate.html b/demos/effect_methods/animate.html
deleted file mode 100644
index 1e22ead8f..000000000
--- a/demos/effect_methods/animate.html
+++ /dev/null
@@ -1,52 +0,0 @@
-<!doctype html>
-<html lang="en">
-<head>
- <title>jQuery UI Effect Methods - Animate Demo</title>
- <link type="text/css" href="../../themes/base/ui.all.css" rel="stylesheet" />
- <script type="text/javascript" src="../../jquery-1.3.2.js"></script>
- <script type="text/javascript" src="../../ui/effects.core.js"></script>
- <link type="text/css" href="../demos.css" rel="stylesheet" />
- <style type="text/css">
- .toggler { width: 500px; height: 200px; }
- #button { padding: .5em 1em; text-decoration: none; }
- #animate { width: 240px; height: 135px; padding: 0.4em; background: #fff;}
- #animate h3 { margin: 0; padding: 0.4em; text-align: center; }
- </style>
- <script type="text/javascript">
- $(function() {
- $("#button").toggle(
- function() {
- $("#animate").animate({backgroundColor: '#aa0000', color: '#fff'}, 1000);
- },
- function() {
- $("#animate").animate({backgroundColor: '#fff', color: '#000'}, 1000);
- }
- );
- });
- </script>
-</head>
-<body>
-
-<div class="demo">
-
-<div class="toggler">
- <div id="animate" class="ui-widget-content ui-corner-all">
- <h3 class="ui-widget-header ui-corner-all">Animate</h3>
- <p>
- Etiam libero neque, luctus a, eleifend nec, semper at, lorem. Sed pede. Nulla lorem metus, adipiscing ut, luctus sed, hendrerit vitae, mi.
- </p>
- </div>
-</div>
-
-<a href="#" id="button" class="ui-state-default ui-corner-all">Show Effect</a>
-
-</div><!-- End demo -->
-
-<div class="demo-description">
-
-<p>Click the button above to preview the effect.</p>
-
-</div><!-- End demo-description -->
-
-</body>
-</html>
diff --git a/demos/effect_methods/effect.html b/demos/effect_methods/effect.html
deleted file mode 100644
index 6c84bc98a..000000000
--- a/demos/effect_methods/effect.html
+++ /dev/null
@@ -1,49 +0,0 @@
-<!doctype html>
-<html lang="en">
-<head>
- <title>jQuery UI Effect Methods - Effect Demo</title>
- <link type="text/css" href="../../themes/base/ui.all.css" rel="stylesheet" />
- <script type="text/javascript" src="../../jquery-1.3.2.js"></script>
- <script type="text/javascript" src="../../ui/effects.core.js"></script>
- <script type="text/javascript" src="../../ui/effects.bounce.js"></script>
- <link type="text/css" href="../demos.css" rel="stylesheet" />
- <style type="text/css">
- .toggler { width: 500px; height: 200px; }
- #button { padding: .5em 1em; text-decoration: none; }
- #effect { width: 240px; height: 135px; padding: 0.4em; }
- #effect h3 { margin: 0; padding: 0.4em; text-align: center; }
- </style>
- <script type="text/javascript">
- $(function() {
- $("#button").click(function() {
- $("#effect").effect("bounce");
- });
- });
- </script>
-</head>
-<body>
-
-<div class="demo">
-
-<div class="toggler">
- <div id="effect" class="ui-widget-content ui-corner-all">
- <h3 class="ui-widget-header ui-corner-all">Effect</h3>
- <p>
- Etiam libero neque, luctus a, eleifend nec, semper at, lorem. Sed pede. Nulla lorem metus, adipiscing ut, luctus sed, hendrerit vitae, mi.
- </p>
- </div>
-</div>
-
-<a href="#" id="button" class="ui-state-default ui-corner-all">Show Effect</a>
-
-
-</div><!-- End demo -->
-
-<div class="demo-description">
-
-<p>Click the button above to show the effect.</p>
-
-</div><!-- End demo-description -->
-
-</body>
-</html>
diff --git a/demos/effect_methods/hide.html b/demos/effect_methods/hide.html
deleted file mode 100644
index d1de3c3d7..000000000
--- a/demos/effect_methods/hide.html
+++ /dev/null
@@ -1,47 +0,0 @@
-<!doctype html>
-<html lang="en">
-<head>
- <title>jQuery UI Effect Methods - Hide Demo</title>
- <link type="text/css" href="../../themes/base/ui.all.css" rel="stylesheet" />
- <script type="text/javascript" src="../../jquery-1.3.2.js"></script>
- <script type="text/javascript" src="../../ui/effects.core.js"></script>
- <script type="text/javascript" src="../../ui/effects.bounce.js"></script>
- <link type="text/css" href="../demos.css" rel="stylesheet" />
- <style type="text/css">
- .toggler { width: 500px; height: 200px; }
- #button { padding: .5em 1em; text-decoration: none; }
- #hide { width: 240px; height: 135px; padding: 0.4em; }
- #hide h3 { margin: 0; padding: 0.4em; text-align: center; }
- </style>
- <script type="text/javascript">
- $(function() {
- $("#button").click(function() {
- $('#hide').hide("bounce");
- });
- });
- </script>
-</head>
-<body>
-
-<div class="demo">
-
-<div class="toggler">
- <div id="hide" class="ui-widget-content ui-corner-all">
- <h3 class="ui-widget-header ui-corner-all">Hide</h3>
- <p>
- Etiam libero neque, luctus a, eleifend nec, semper at, lorem. Sed pede. Nulla lorem metus, adipiscing ut, luctus sed, hendrerit vitae, mi.
- </p>
- </div>
-</div>
-<a href="#" id="button" class="ui-state-default ui-corner-all">Show Effect</a>
-
-</div><!-- End demo -->
-
-<div class="demo-description">
-
-<p>Click the button above to preview the effect.</p>
-
-</div><!-- End demo-description -->
-
-</body>
-</html>
diff --git a/demos/effect_methods/show.html b/demos/effect_methods/show.html
deleted file mode 100644
index 5723874e5..000000000
--- a/demos/effect_methods/show.html
+++ /dev/null
@@ -1,49 +0,0 @@
-<!doctype html>
-<html lang="en">
-<head>
- <title>jQuery UI Effect Methods - Show Demo</title>
- <link type="text/css" href="../../themes/base/ui.all.css" rel="stylesheet" />
- <script type="text/javascript" src="../../jquery-1.3.2.js"></script>
- <script type="text/javascript" src="../../ui/effects.core.js"></script>
- <script type="text/javascript" src="../../ui/effects.bounce.js"></script>
- <link type="text/css" href="../demos.css" rel="stylesheet" />
- <style type="text/css">
- .toggler { width: 500px; height: 200px; }
- #button { padding: .5em 1em; text-decoration: none; }
- #show { width: 240px; height: 135px; padding: 0.4em; }
- #show h3 { margin: 0; padding: 0.4em; text-align: center; }
- </style>
- <script type="text/javascript">
- $(function() {
- $("#button").click(function() {
- $("#show").show("bounce");
- });
- $('#show').hide();
- });
- </script>
-</head>
-<body>
-
-<div class="demo">
-
-<div class="toggler">
- <div id="show" class="ui-widget-content ui-corner-all">
- <h3 class="ui-widget-header ui-corner-all">Show</h3>
- <p>
- Etiam libero neque, luctus a, eleifend nec, semper at, lorem. Sed pede. Nulla lorem metus, adipiscing ut, luctus sed, hendrerit vitae, mi.
- </p>
- </div>
-</div>
-<a href="#" id="button" class="ui-state-default ui-corner-all">Show Effect</a>
-
-
-</div><!-- End demo -->
-
-<div class="demo-description">
-
-<p>Click the button above to show the effect.</p>
-
-</div><!-- End demo-description -->
-
-</body>
-</html>
diff --git a/demos/effect_methods/switch-class.html b/demos/effect_methods/switch-class.html
deleted file mode 100644
index c1ed06fe8..000000000
--- a/demos/effect_methods/switch-class.html
+++ /dev/null
@@ -1,53 +0,0 @@
-<!doctype html>
-<html lang="en">
-<head>
- <title>jQuery UI Effect Methods - Switch Class Demo</title>
- <link type="text/css" href="../../themes/base/ui.all.css" rel="stylesheet" />
- <script type="text/javascript" src="../../jquery-1.3.2.js"></script>
- <script type="text/javascript" src="../../ui/effects.core.js"></script>
- <link type="text/css" href="../demos.css" rel="stylesheet" />
- <style type="text/css">
- .toggler { width: 500px; height: 200px; }
- #button { padding: .5em 1em; text-decoration: none; }
- #animate h3 { margin: 0; padding: 0.4em; text-align: center; }
- .first { width: 240px; height: 135px; padding: 0.4em; }
- .second { width: 480px; height: 135px; padding: 0.4em; font-size: 1.6em; }
- </style>
- <script type="text/javascript">
- $(function() {
- $("#button").toggle(
- function() {
- $("#animate").switchClass('first', 'second');
- },
- function() {
- $("#animate").switchClass('second', 'first');
- }
- );
- });
- </script>
-</head>
-<body>
-
-<div class="demo">
-
-<div class="toggler">
- <div id="animate" class="first ui-widget-content ui-corner-all">
- <h3 class="ui-widget-header ui-corner-all">Animate</h3>
- <p>
- Etiam libero neque, luctus a, eleifend nec, semper at, lorem. Sed pede. Nulla lorem metus, adipiscing ut, luctus sed, hendrerit vitae, mi.
- </p>
- </div>
-</div>
-
-<a href="#" id="button" class="ui-state-default ui-corner-all">Show Effect</a>
-
-</div><!-- End demo -->
-
-<div class="demo-description">
-
-<p>Click the button above to preview the effect.</p>
-
-</div><!-- End demo-description -->
-
-</body>
-</html>
diff --git a/demos/effect_methods/toggle-class.html b/demos/effect_methods/toggle-class.html
deleted file mode 100644
index 77ae5e686..000000000
--- a/demos/effect_methods/toggle-class.html
+++ /dev/null
@@ -1,48 +0,0 @@
-<!doctype html>
-<html lang="en">
-<head>
- <title>jQuery UI Effect Methods - Add Class Demo</title>
- <link type="text/css" href="http://jquery-ui.googlecode.com/svn/trunk/themes/base/ui.all.css" rel="stylesheet" />
- <script type="text/javascript" src="http://jquery-ui.googlecode.com/svn/trunk/jquery-1.3.2.js"></script>
- <script type="text/javascript" src="http://jquery-ui.googlecode.com/svn/trunk/ui/effects.core.js"></script>
- <link type="text/css" href="http://jquery-ui.googlecode.com/svn/trunk/demos/demos.css" rel="stylesheet" />
- <style type="text/css">
- .toggler { width: 500px; height: 200px; }
- #button { padding: .5em 1em; text-decoration: none; }
- #animate { width: 240px; padding: 0.4em; }
- #animate h3 { margin: 0; padding: 0.4em; text-align: center; }
- .class { font-size: 1.6em; }
- </style>
- <script type="text/javascript">
- $(function() {
- $("#button").click(function() {
- $('#animate').toggleClass('class', 1000);
- });
- });
- </script>
-</head>
-<body>
-
-<div class="demo">
-
-<div class="toggler">
- <div id="animate" class="ui-widget-content ui-corner-all">
- <h3 class="ui-widget-header ui-corner-all">Animate</h3>
- <p>
- Etiam libero neque, luctus a, eleifend nec, semper at, lorem. Sed pede. Nulla lorem metus, adipiscing ut, luctus sed, hendrerit vitae, mi.
- </p>
- </div>
-</div>
-
-<a href="#" id="button" class="ui-state-default ui-corner-all">Show Effect</a>
-
-</div><!-- End demo -->
-
-<div class="demo-description">
-
-<p>Click the button above to preview the effect.</p>
-
-</div><!-- End demo-description -->
-
-</body>
-</html>
diff --git a/demos/effect_methods/toggle.html b/demos/effect_methods/toggle.html
deleted file mode 100644
index 6d5b09538..000000000
--- a/demos/effect_methods/toggle.html
+++ /dev/null
@@ -1,46 +0,0 @@
-<!doctype html>
-<html lang="en">
-<head>
- <title>jQuery UI Effect Methods - Toggle Demo</title>
- <link type="text/css" href="../../themes/base/ui.all.css" rel="stylesheet" />
- <script type="text/javascript" src="../../jquery-1.3.2.js"></script>
- <script type="text/javascript" src="../../ui/effects.core.js"></script>
- <script type="text/javascript" src="../../ui/effects.bounce.js"></script>
- <link type="text/css" href="../demos.css" rel="stylesheet" />
- <style type="text/css">
- .toggler { width: 500px; height: 200px; }
- #button { padding: .5em 1em; text-decoration: none; }
- #toggle { width: 240px; height: 135px; padding: 0.4em; }
- #toggle h3 { margin: 0; padding: 0.4em; text-align: center; }
- </style>
- <script type="text/javascript">
- $(function() {
- $("#button").click(function() {
- $("#toggle").toggle("bounce");
- });
- });
- </script>
-</head>
-<body>
-
-<div class="demo">
-
-<div class="toggler">
- <div id="toggle" class="ui-widget-content ui-corner-all">
- <h3 class="ui-widget-header ui-corner-all">Toggle</h3>
- <p>
- Etiam libero neque, luctus a, eleifend nec, semper at, lorem. Sed pede. Nulla lorem metus, adipiscing ut, luctus sed, hendrerit vitae, mi.
- </p>
- </div>
-</div>
-<a href="#" id="button" class="ui-state-default ui-corner-all">Show Effect</a>
-</div><!-- End demo -->
-
-<div class="demo-description">
-
-<p>Click the button above to preview the effect.</p>
-
-</div><!-- End demo-description -->
-
-</body>
-</html>
generated by cgit v1.2.3 (git 2.39.1) at 2025-04-29 08:52:57 +0000