Class animation demos: Don't chain id and class selectors together in CSS since IE6...

diff --git a/demos/addClass/default.html b/demos/addClass/default.html
index 1bb33b362f6e622410aae232776cd51cd0219892..e2d9a79b0964940be94311523e0b8a7aa04f6dbb 100644 (file)
--- a/demos/addClass/default.html
+++ b/demos/addClass/default.html
@@ -11,7 +11,7 @@
                .toggler { width: 500px; height: 200px; position: relative;}
                #button { padding: .5em 1em; text-decoration: none; }
                #effect { width: 240px;  padding: 1em;  font-size: 1.2em; border: 1px solid #000; background: #eee; color: #333; }
-               #effect.newClass { text-indent: 40px; letter-spacing: .4em; width: 410px; height: 100px; padding: 30px; margin: 10px; font-size: 1.6em; }
+               .newClass { text-indent: 40px; letter-spacing: .4em; width: 410px; height: 100px; padding: 30px; margin: 10px; font-size: 1.6em; }
        </style>
        <script type="text/javascript">
        $(function() {

diff --git a/demos/removeClass/default.html b/demos/removeClass/default.html
index 15a5a57562b05eeb8be9bad1e89fb728a79f07e3..0d3b10e8d9aa9c8f71d4c8b5fe0e9280ca7238a7 100644 (file)
--- a/demos/removeClass/default.html
+++ b/demos/removeClass/default.html
@@ -11,7 +11,7 @@
                .toggler { width: 500px; height: 200px; position: relative;}
                #button { padding: .5em 1em; text-decoration: none; }
                #effect {position: relative;  width: 240px;  padding: 1em;  letter-spacing: 0; font-size: 1.2em; border: 1px solid #000; background: #eee; color: #333; }
-               #effect.newClass { text-indent: 40px; letter-spacing: .4em; width: 410px; height: 100px; padding: 30px; margin: 10px; font-size: 1.6em; }
+               .newClass { text-indent: 40px; letter-spacing: .4em; width: 410px; height: 100px; padding: 30px; margin: 10px; font-size: 1.6em; }
        </style>
        <script type="text/javascript">
        $(function() {

diff --git a/demos/switchClass/default.html b/demos/switchClass/default.html
index bfb0c9c8b566b6ff3af4eda29ca44e8f7a08941c..81c69c879050683d11aa547b6299bd3b089ff2fc 100644 (file)
--- a/demos/switchClass/default.html
+++ b/demos/switchClass/default.html
@@ -11,8 +11,8 @@
                .toggler { width: 500px; height: 200px; position: relative;}
                #button { padding: .5em 1em; text-decoration: none; }
                #effect {position: relative;   }
-               #effect.newClass { width: 240px;  padding: 1em; letter-spacing: 0; font-size: 1.2em; }
-               #effect.anotherNewClass { text-indent: 40px; letter-spacing: .4em; width: 410px; height: 100px; padding: 30px; margin: 10px; font-size: 1.6em; }
+               .newClass { width: 240px;  padding: 1em; letter-spacing: 0; font-size: 1.2em; margin: 0; }
+               .anotherNewClass { text-indent: 40px; letter-spacing: .4em; width: 410px; height: 100px; padding: 30px; margin: 10px; font-size: 1.6em; }
        </style>
        <script type="text/javascript">
        $(function() {

diff --git a/demos/toggleClass/default.html b/demos/toggleClass/default.html
index b679c96b775766b50e561c6460847c0a217f91bd..4c045097eaf14f94507b234a0ed60778f83e091e 100644 (file)
--- a/demos/toggleClass/default.html
+++ b/demos/toggleClass/default.html
@@ -11,7 +11,7 @@
                .toggler { width: 500px; height: 200px; position: relative;}
                #button { padding: .5em 1em; text-decoration: none; }
                #effect {position: relative;  width: 240px;  padding: 1em; letter-spacing: 0; font-size: 1.2em; border: 1px solid #000; background: #eee; color: #333; }
-               #effect.newClass { text-indent: 40px; letter-spacing: .4em; width: 410px; height: 100px; padding: 30px; margin: 10px; font-size: 1.6em; }
+               .newClass { text-indent: 40px; letter-spacing: .4em; width: 410px; height: 100px; padding: 30px; margin: 10px; font-size: 1.6em; }
        </style>
        <script type="text/javascript">
        $(function() {