Databases
StackOverflow2013
Postsdbo
POjQuery UI - addClass removeClass - CSS values are stuck
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POjQuery UI - addClass removeClass - CSS values are stuck
    primarykey
    data
    text
    <p>I'm trying to do a simple animation.</p> <ol> <li>You show the div. It animates correctly.</li> <li>You hide the div. Correct.</li> <li>You show the div again. It shows but there is no animation. It is stuck at the value of when you first interrupted it.</li> </ol> <p>So somehow the interpolation CSS that is happening during [add|remove]Class is getting stuck there. The second time around, the [add|remove]Class is actually running, but the css it's setting from the class is getting ignored (I think being overshadowed). How can I fix this WITHOUT resorting to .animate and hard-coded style values? The whole point was to put the animation end point in a css class.</p> <p>Thanks!</p> <pre><code>&lt;!doctype html&gt; &lt;style type="text/css"&gt; div { width: 400px; height: 200px; } .green { background-color: green; } &lt;/style&gt; &lt;script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" type="text/javascript"&gt;&lt;/script&gt; &lt;script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js" type="text/javascript"&gt;&lt;/script&gt; &lt;script type="text/javascript"&gt; $(function() { $('#show').bind({ click: function() { showAndRun() } }) $('#hide').bind({ click: function() { $('div').stop(true, false).fadeOut('slow') } }) function showAndRun() { function pulse() { $('div').removeClass('green', 2000, function() { $(this).addClass('green', 2000, pulse) }) } $('div').stop(true, false).hide().addClass('green').fadeIn('slow', pulse) } }) &lt;/script&gt; &lt;input id="show" type="button" value="show" /&gt;&lt;input id="hide" type="button" value="hide" /&gt; &lt;div style="display: none;"&gt;&lt;/div&gt; </code></pre> <p>You can also look at what it does <a href="http://jsbin.com/atugo" rel="nofollow noreferrer">here at jsbin</a></p>
    singulars
    1. PO
      singulars
      1. PTAnswer
    1. This table or related slice is empty.
    1. PTQuestion
    1. USEarlz
    1. USJason Dunkelberger
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. PO
      singulars
      1. PTAnswer
    1. VO
      singulars
      1. POjQuery UI - addClass removeClass - CSS values are stuck
      1. This table or related slice is empty.
      1. VTUpMod
    2. VO
      singulars
      1. POjQuery UI - addClass removeClass - CSS values are stuck
      1. This table or related slice is empty.
      1. VTUpMod
    3. VO
      singulars
      1. POjQuery UI - addClass removeClass - CSS values are stuck
      1. This table or related slice is empty.
      1. VTUpMod
    1. CO@Jason is that link I added at jsbin correct? It sounds like the problem your describing.
      singulars
      1. POjQuery UI - addClass removeClass - CSS values are stuck
      1. USEarlz
    2. COYes that is an accurate reflection of my problem, thanks.
      singulars
      1. POjQuery UI - addClass removeClass - CSS values are stuck
      1. USJason Dunkelberger
 

Querying!

 
Guidance
A row detail

Detail views are divided into sections. All the information in the data section comes from columns in the selected row. The other sections display data from other, related rows.

Related data can be related in a to-one or a to-many fashion. Captions of data related in a to-many fashion link to a list view showing a filtered view of the table.

Try moving around until you find a non-empty to-many entry and click on the label to get to one. You can move back to the root by clicking on the database name in the header.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload