benbarnett / jquery-animate-enhanced

Extend $.animate() to detect CSS transitions for Webkit, Mozilla, IE>=10 and Opera and convert animations automatically.
http://playground.benbarnett.net/jquery-animate-enhanced/
MIT License
1.39k stars 196 forks source link

wrong display values #121

Closed smacky closed 11 years ago

smacky commented 11 years ago

In the _interpretValue() you make one exception, the LI tag gets the display:list-item value, but everything else becomes display:block, which is wrong for a small amount of tags like TD or TR

This is a possible fix for this:

Line 321 (in v0.99 uncompressed):

- if (hidden) e.css({'display': (e.context.tagName == 'LI') ? 'list-item' : 'block', 'opacity': 0});
+ if (hidden) e.css({'display': _domElementVisibleDisplayValue(e.context.tagName), 'opacity': 0});

And add this function to the code:

function _domElementVisibleDisplayValue(tagName) {
    tagName = tagName.toUpperCase();
    var displayValues = {
      'LI'       : 'list-item',
      'TR'       : 'table-row',
      'TD'       : 'table-cell',
      'TH'       : 'table-cell',
      'CAPTION'  : 'table-caption',
      'COL'      : 'table-column',
      'COLGROUP' : 'table-column-group',
      '???'      : 'table-footer-group',
      '???'      : 'table-header-group',
      '???'      : 'table-row-group'
    };
    return typeof displayValues[tagName] == 'string' ? displayValues[tagName] : 'block';
  }

I couldn't find out what the last 3 values are for :)

Thanks in advance for applying this small patch.

benbarnett commented 11 years ago

Thanks, I'll add this now