jquery ui-effects-wrapper verursacht Verwüstung

Question

Ich benutze jquery-ui und irgendwann verwende ich die Funktionen zum Ein- und Ausblenden ziemlich stark, um wechselnde Bilder zu animieren, die ein- und ausgehen.

Aus irgendeinem Grund reagieren die Steuerelemente auf meiner Seite nach einigen Versuchen plötzlich nicht mehr auf Klicks. Nach ein bisschen Stochern mit Firebug entdeckte ich, dass meine Seite mit div's der Klasse ui-effects-wrapper gefüllt ist.

Ich habe keine Ahnung, warum das passiert oder wie man es stoppt. Wenn ich diese divs entferne, kann ich die Bilder, die ich animiert habe, nicht mehr sehen.

Irgendwelche Ideen?

Answer 1

UI-Effekte-Wrapper wurde von Jquery UI-Effekt-Plugin hinzugefügt.

Hier ist ein Code aus jquery.effects.core.js genommen:

// Wraps the element around a wrapper that copies position properties 
createWrapper: function(element) { 

    // if the element is already wrapped, return it 
    if (element.parent().is('.ui-effects-wrapper')) { 
     return element.parent(); 
    } 

    // wrap the element 
    var props = { 
      width: element.outerWidth(true), 
      height: element.outerHeight(true), 
      'float': element.css('float') 
     }, 
     wrapper = $('<div></div>') 
      .addClass('ui-effects-wrapper') 
      .css({ 
       fontSize: '100%', 
       background: 'transparent', 
       border: 'none', 
       margin: 0, 
       padding: 0 
      }); 

    element.wrap(wrapper); 
    wrapper = element.parent(); //Hotfix for jQuery 1.4 since some change in wrap() seems to actually loose the reference to the wrapped element 

    // transfer positioning properties to the wrapper 
    if (element.css('position') == 'static') { 
     wrapper.css({ position: 'relative' }); 
     element.css({ position: 'relative' }); 
    } else { 
     $.extend(props, { 
      position: element.css('position'), 
      zIndex: element.css('z-index') 
     }); 
     $.each(['top', 'left', 'bottom', 'right'], function(i, pos) { 
      props[pos] = element.css(pos); 
      if (isNaN(parseInt(props[pos], 10))) { 
       props[pos] = 'auto'; 
      } 
     }); 
     element.css({position: 'relative', top: 0, left: 0, right: 'auto', bottom: 'auto' }); 
    } 

    return wrapper.css(props).show(); 
}, 

Answer 2

In einer Funktion hatte ich einige Code, der die Sichtbarkeit von zwei Tasten und beschäftigt Effekte wie fadeTo und Bounce umgeschaltet. Gelegentlich würde noch ein Wrapper übrig sein. Ich habe versucht, dies zu meiner Methode hinzuzufügen, die Idee ist, dass es die Wrapper 1.1 Sekunden entfernt, nachdem die Effekte in die Warteschlange gestellt wurden.

setTimeout('$(".ui-effects-wrapper").children().unwrap();', 1100); 

Dies entfernt die veralteten Wrapper, aber es besteht die Chance, dass es auch nachfolgende Wrapper entfernen können, die für Effekte genutzt werden.

Ich wäre sehr daran interessiert, Verbesserungen dieser Technik zu sehen.