jQuery Animieren Deckkraft in IE8

Auf der Website bin ich derzeit arbeiten, habe ich eine <ul> mit einer Last von <li>'s, die enthalten jeweils <div>, <span>, <img> etc.

Wenn ich den Mauszeiger über eines der <li>'s, ich bin mit jQuery animieren der Deckkraft aller anderen <li>'s auf 0,3, um die Aufmerksamkeit auf die fokussierte <li>.

Mein problem ist IE8 (und nur IE8) wird die Animation der <li>'s Deckkraft, aber keines der untergeordneten Elemente innerhalb dieser <li>.

Jemand kommen über dieses Problem vor, oder weiß eine Lösung?

Dank!

EDIT:

Finden Sie in der folgenden jsFiddle für ein Beispiel - http://jsfiddle.net/BJ8gK/22/

  • veröffentlichen Sie Ihren code in jsfiddle oder so
  • Ich kann nicht replizieren das Problem hier: jsfiddle.net/jfriend00/BJ8gK. Können Sie genauere Angaben über Ihr HTML und Ihre jQuery-code, der die animation.
  • Sie muss post-code! Wir sind nicht der Verstand-Leser.
  • FYI, DH verwendet filter zur Steuerung der Deckkraft und der filter gilt nur für untergeordnete Objekte in einigen Fällen, aber die Umstände sind speziell auf Ihre HTML-und CSS.
  • Entschuldigung, finden Sie in der folgenden jsFiddle für ein Beispiel. Ich kann bestätigen, das Problem repliziert werden, in meinem IE8 - jsfiddle.net/BJ8gK/22
InformationsquelleAutor Probocop | 2011-10-05
  1. 16

    Ich hatte ein ähnliches problem - im IE8 um sicherzustellen, dass die Kind-Elemente' die Deckkraft ist auch betroffen, wenn die änderung der Deckkraft des jeweils übergeordneten Elements müssen Sie die css-Regel

    filter:inherit

    um die child-Elemente. Einfache Lösung, aber vielleicht verdecken

    • Ich Liebe dich Mann! Gelöst für mich. 🙂
    • Dies löste meine Probleme. Ich bin das anzeigen/ausblenden <section>'s mit einem jquery-inview-plugin. und es Kind-Elemente sind immer sichtbar.
    • Liebe es - verbrachte Ewigkeiten versuchen zu lösen...
    InformationsquelleAutor Buzz Robinson
  2. 0

    IE8 die "Deckkraft" - support ist bekannt für sein extrem unausgereift und buggy.

    jQuery macht einen guten job und abstrahiert die details Weg von Ihnen, wie ein Entwickler, aber Sie können nicht verhindern, dass die einfache Tatsache, dass das feature funktioniert nicht gut in diesem browser.

    Meine Empfehlung wäre, das Ruder herumreißen völlig, und statt ausblenden das element, das Sie sehen können, stattdessen haben Sie eine versteckte element, das ist eine Reine white-box die gleiche Größe und fade, dass in statt.

    Wird der Effekt ziemlich gleich, aber sollte besser funktionieren, im IE werden, da Sie nur Auswirkungen auf die Deckkraft eines einzelnen Elements.

    InformationsquelleAutor Spudley
  3. 0

    Habe ich versucht zu animieren Deckkraft auf Zeilen in einer Datatable und festgestellt, dass JQuery 1.10 versuchen und lösen die IE8 Deckkraft intern. Es geht aber nicht fix die geerbten Elemente Problem. Dieses fragment-code hinzufügt und zeigt eine neue Zeile an einem nummerierten Tisch, den anderen helfen kann:

    //add the row to the table
newRow = dTable.row.add(rowData);
dTable.draw();
newIdx = newRow.index();
pos = dTable.rows()[0].indexOf(newIdx);
//draw item on correct page, from page.jumpToData()
if (pos >= 0) {
  var page = Math.floor(pos / dTable.page.info().length);
  dTable.page(page).draw(false);
  var jqRow = newRow.nodes().to$();
  var cells = jqRow.children('th,td');
  if (editable > 0) {
     //focus on first editable cell in new row...
     cells.eq(editable).click();
  }
  //child elements need to inherit - see answer by Buzz
  cells.css( 'filter', 'inherit');
  jqRow.addClass('highlight').css('opacity', 0.2);
  jqRow.animate({opacity: 1.0});
  jqRow.animate({opacity: 0.2});
  jqRow.animate({opacity: 1.0}, 2000, 'swing', function () {
  $(this).removeClass('highlight');
});
    InformationsquelleAutor vogomatix
Schreibe einen Kommentar