My mistake. I saw the effects on the jQuery UI site so I assumed that it was part of that library. Thanks!
On Nov 12, 9:14 pm, Scott González <[email protected]> wrote: > Calling .show() and .hide() with just a speed is not part of jQuery > UI, it is part of jQuery core. You might want to ask this question on > the jquery-en list instead. > > On Nov 11, 12:20 pm, The alMIGHTY N <[email protected]> wrote: > > > I have a page with a DIV at the top that is shown and hidden with the > > jQueryUI show and hide effects. Underneath it is a TABLE whose > > vertical position shifts up and down depending on whether the DIV is > > shown or hidden. > > > In Internet Explorer 7, when the hide animation is just about done, > > the TABLE suddenly shifts to a vertical position even lower than when > > the DIV is shown but only for a split second after which it returns to > > the spot where it should be. This happens no matter what speed I > > assign to the effect. > > > In Firefox 3, when the show animation is in progress, a "memory" of > > the TABLE remains within the DIV even as the TABLE itself is visibly > > shifting downwards on the page. This only seems to happen when the > > table has a lot of row/columns *and* a decent amount of styling > > (background colors, padding, alignment, etc.) - if I use a table with > > no styling and/or few columns and rows, this behavior doesn't > > manifest. It also only happens the first time the show effect occurs. > > > I've included the complete HTML/JavaScript/CSS below. Thanks for any > > help! I need it badly because the real page on which this example is > > based is one part of my attempt to convince the company that we should > > use jQuery. > > > <html> > > <head> > > <link rel="stylesheet" type="text/css" href="http:// > > ajax.googleapis.com/ajax/libs/jqueryui/1.7.2/themes/smoothness/jquery- > > ui.css"/> > > <style type="text/css"> > > body { font-family: Calibri, Arial, Helvetica, > > sans-serif; } > > .data { margin-top: 5px; } > > .data td { padding: 3px 5px; font-size: 10pt; } > > .data th { padding: 3px 5px; background-color: > > #003399; font-size: > > 8pt; color: #ffffff; } > > </style> > > <script type="text/javascript" src="http://ajax.googleapis.com/ > > ajax/libs/jquery/1.3.2/jquery.min.js"></script> > > <script type="text/javascript" src="http://ajax.googleapis.com/ > > ajax/libs/jqueryui/1.7.2/jquery-ui.min.js"></script> > > <script type="text/javascript"> > > $(document).ready(function() { > > $("#toggler").toggle(function() { > > > > $("#hiddenInPlainSight").show("fast"); > > }, function() { > > > > $("#hiddenInPlainSight").hide("fast"); > > }); > > > }); > > </script> > > </head> > > <body> > > <a id="toggler" href="#">Show</a> > > <div id="hiddenInPlainSight" style="display: none;"> > > <div><select size="1"><option>A</option><option>B</ > > option><option>C</option><option>D</option></select></div> > > <div style="width: 400px; height: 141px; border: solid 1px > > #cccccc; padding: 5px; overflow: auto;">Nothing for right now.</div> > > <input type="button" value="OK"/><input type="button" > > value="Cancel"/> > > </div> > > <div style="margin-top: 10px;"><input type="text"/> to <input > > type="text"/></div> > > <table class="data" border="0" cellpadding="0" > > cellspacing="0"> > > <tbody> > > <tr> > > <th>Name</th> > > <th>ID</th> > > <th>My Opinion</th> > > <th>Your Opinion</th> > > <th>Original Quantity</th> > > <th>Original Price</th> > > <th>Discounted Quantity</th> > > <th>Discounted Price</th> > > <th>Bulk Quantity</th> > > <th>Bulk Price</th> > > </tr> > > <tr> > > <td>A</td> > > <td>1</td> > > <td>Blah blah blah blah blah</td> > > <td>Yadda yadda yadda yadda yadda</td> > > <td>123</td> > > <td>$9.99</td> > > <td>123</td> > > <td>$9.99</td> > > <td>123</td> > > <td>$9.99</td> > > </tr> > > <tr style="background-color: #cccccc;"> > > <td>B</td> > > <td>2</td> > > <td>Blah blah blah blah blah</td> > > <td>Yadda yadda yadda yadda yadda</td> > > <td>123</td> > > <td>$9.99</td> > > <td>123</td> > > <td>$9.99</td> > > <td>123</td> > > <td>$9.99</td> > > </tr> > > <tr> > > <td>C</td> > > <td>3</td> > > <td>Blah blah blah blah blah</td> > > <td>Yadda yadda yadda yadda yadda</td> > > <td>123</td> > > <td>$9.99</td> > > <td>123</td> > > <td>$9.99</td> > > <td>123</td> > > <td>$9.99</td> > > </tr> > > <tr style="background-color: #cccccc;"> > > <td>D</td> > > <td>4</td> > > <td>Blah blah blah blah blah</td> > > <td>Yadda yadda yadda yadda yadda</td> > > <td>123</td> > > <td>$9.99</td> > > <td>123</td> > > <td>$9.99</td> > > <td>123</td> > > <td>$9.99</td> > > </tr> > > <tr> > > <td>E</td> > > <td>5</td> > > <td>Blah blah blah blah blah</td> > > <td>Yadda yadda yadda yadda yadda</td> > > <td>123</td> > > <td>$9.99</td> > > <td>123</td> > > <td>$9.99</td> > > <td>123</td> > > <td>$9.99</td> > > </tr> > > <tr style="background-color: #cccccc;"> > > <td>F</td> > > <td>6</td> > > <td>Blah blah blah blah blah</td> > > <td>Yadda yadda yadda yadda yadda</td> > > <td>123</td> > > <td>$9.99</td> > > <td>123</td> > > <td>$9.99</td> > > <td>123</td> > > <td>$9.99</td> > > </tr> > > </tbody> > > </table> > > </body> > > </html> -- You received this message because you are subscribed to the Google Groups "jQuery UI" group. To post to this group, send email to [email protected]. To unsubscribe from this group, send email to [email protected]. For more options, visit this group at http://groups.google.com/group/jquery-ui?hl=.
