jQuery: marge IE8 s'effondre lorsque vous utilisez slideUp()/slideDown()

J'ai téléchargé un fichier de test ici:jQuery: marge IE8 s'effondre lorsque vous utilisez slideUp()/slideDown()

http://dl.dropbox.com/u/2201804/IE8test.html

Si vous cliquez sur le lien "Cliquez-moi" divs, vous verrez les divs "Feedback" apparaissent en utilisant slideDown(). En cliquant sur un "Cliquez sur moi" dans une autre case, vous faites glisser les commentaires en cours vers le haut et faites glisser les commentaires appropriés.

Dans IE8, après que les actions slideUp()/slideDown() sont terminées, la marge entre les boîtes se réduit.

Est-ce un problème avec l'animation de jQuery ou un bogue d'affichage dans IE8?

Source

2010-03-25 theJBRU

overflow: hidden;

devrait faire le travail :)

Source

2010-07-21 12:47:51 c97

Avait le même problème dans IE8, ajoutant le débordement: caché à l'élément qui se développe/rétrécit résolu! – DanC

Cela a fonctionné pour moi aussi. Quelqu'un peut-il expliquer pourquoi cela fonctionne? Est-ce juste un bug IE? IE9 fait-il la même chose? – dkamins

Moi aussi je voudrais savoir POURQUOI ça marche ... qu'est-ce que le débordement: les cachés ont à voir avec les marges de disparition? – Sorcy

Je n'ai pas de solution pour vous en utilisant les marges, mais si vous remplacez la marge par un remplissage, IE8 jouera le jeu. Dans votre cas, vous auriez besoin d'un conteneur div supplémentaire, car vous utilisez déjà le remplissage et vous avez un jeu de couleurs d'arrière-plan.

donc votre solution pourrait ressembler à ceci:

<div class="assessment"> 
    <div class="inner"> 
    <div class="question"> 
... 

.assessment { 
    padding-top: 20px; 
    background: transparent; 
} 

.assessment .inner { 
    background-color:#DDDDDD; 
    border:1px solid #CCCCCC; 
    color:#555555; 
    display:block; 
    padding:10px 0; 
    text-align:left; 
    width:100%; 
}

Vive tj

Source

2010-04-13 08:35:07

juste mettre à jour ce vieux fil avec ma solution que je n'ai pas pu résoudre le problème en utilisant CSS. J'ai utilisé la fonction callback de slideToggle pour me concentrer sur le corps du document car j'ai remarqué que cliquer ailleurs sur la page semblait provoquer une refusion du DOM et que les marges revenaient.

.slideToggle(
    500, 
    function() { 
     document.body.focus(); 
    } 
);

Source

2012-09-04 18:51:07 rpf3

-1

je toujours des problèmes avec des marges en voie de disparition en utilisant ce « overflow: hidden » suggestion, et a décidé de désactiver simplement la fonctionnalité slideUp/slideDown entièrement dans IE8 en remplaçant la fonctionnalité jQuery « par défaut » avec une fonction personnalisée afficherait ou masquerait toujours l'élément, mais uniquement lorsque était utilisé lorsque IE8 était utilisé.

Pour ce faire, j'ai utilisé un IE conditional comment pour ajouter une classe à l'élément HTML, comme:

<!--[if IE 8]><html class="ie8"><![endif]-->

Ensuite, je définissais la fonction suivante dans mon javascript pour remplacer la fonction slideUp/slideDown, comme donc:

(function($) { 
    // disable slideDown/slideUp in IE8 due to margin removal issue 
    if ($('html').hasClass('ie8')) { 
     $.fn.slideDown = function() { 
      return this.show(); 
     };   
     $.fn.slideUp = function() { 
      return this.hide(); 
     }; 
    } 
})(jQuery);

Et cela a résolu le problème pour moi, en ce qui me concerne. J'espère que cela t'aides!

Source

2015-07-03 18:58:23 ouija

jQuery: marge IE8 s'effondre lorsque vous utilisez slideUp()/slideDown()

Répondre

Questions connexes