Correctif PNG sur le nouvel élément

J'utilise this script pour les correctifs PNG pour IE6.Correctif PNG sur le nouvel élément

J'ai remarqué que lorsque je clone un élément, les fichiers PNG clonés ne sont pas fixés même s'ils ont les classes appropriées attachées, et je ne peux pas réappliquer le correctif. J'utilise jquery pour cloner un élément, et je dois utiliser clone (false, false) pour des raisons étendues ... est-il possible d'appliquer le correctif au nouvel élément après l'ajout du clone? Appeler DD_belatedPNG.fix (". Pngfix") à nouveau ne semble pas fonctionner.

Source

2012-08-04 seaofinformation

L'utilisation d'IE6 a chuté considérablement en dessous de 1%. Êtes-vous sûr que cela vaut la peine d'y consacrer quelque chose? – Codo

Pour être honnête, je me pose beaucoup de questions, mais je crois que le développement de sites consiste à connaître votre public cible, et dans ce cas, j'ai besoin qu'il soit le plus large et le plus humain possible. – seaofinformation

Cette solution est pour des éléments de img

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<style> 
    body { 
     background:#0000FF; 
    } 
</style> 
<script type="text/javascript" language="javascript" src="jquery.min.js"></script> 
<script type="text/javascript" language="javascript" src="DD_belatedPNG_0.0.8a.js"></script> 
<script> 
    $(document).ready(function() { 
     function imageClickHandler() { 
      var $newA = $("<a></a>") 
      var $newImg = $(this).find('img').clone(false,false); 
      $newImg.attr("style",""); 
      $newA.append($newImg); 

      $newA.click(imageClickHandler); 
      $(this).parent().append($newA); 
      DD_belatedPNG.fix('img'); 
     } 

     DD_belatedPNG.fix('img'); 
     $('a').click(imageClickHandler); 

    }); 
</script> 
</head> 
<body> 
<a><img src="image.png" /></a> 
</body> 
</html>

EDIT cette solution est pour des éléments bg

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
    <style> 
     body { 
      background:#0000FF; 
     } 

     a { 
      display:inline-block; 
      //display:inline; 
      zoom:1; 
      width:512px; 
      height:512px; 
      background:url(image.png) no-repeat center center; 
      text-decoration:none; 
      outline:none; 
     } 
    </style> 
    <script type="text/javascript" language="javascript" src="jquery.min.js"></script> 
    <script type="text/javascript" language="javascript" src="DD_belatedPNG_0.0.8a.js"></script> 
    <script> 
     $(document).ready(function() { 
      function imageClickHandler() { 
       var $newA = $(this).clone(false,false); 
       $newA.removeAttr("style isImg vmlInitiated vmlBg"); 
       $newA.click(imageClickHandler); 
       $(this).parent().append($newA); 
       DD_belatedPNG.fix('a'); 
      } 

      DD_belatedPNG.fix('a'); 
      $('a').click(imageClickHandler); 

     }); 
    </script> 
</head> 
<body> 
    <a></a> 
</body> 
</html>

Source

2012-08-04 12:02:12

Anton, ça a l'air merveilleux. Je n'ai pas réussi à ajouter que je l'utilise pour les images d'arrière-plan qui sont définies dans le CSS. Cela pourrait-il être modifié pour travailler avec des images d'arrière-plan? – seaofinformation

oui, il peut être modifié de cette façon - voir les modifications dans ma réponse. –

mais à mon avis, nous devrions arrêter de maintenir non seulement l'IE6 mais IE7 aussi, juste parce qu'ils détiennent l'évolution du Web et gâchent l'expérience utilisateur. –

Plutôt que d'utiliser une solution de PNG, il suffit d'utiliser PNGs transparents qui sont supportés par IE (palettisé 8 bits avec alpha). ImageAlpha le fera pour vous si vous utilisez un Mac, sinon vous pouvez utiliser pngquant (sur lequel ImageAlpha est basé) pour le faire pour vous.

Javascript/IE Ce type de filtre n'est pas nécessaire pour résoudre ce problème et doit être évité.

Source

2012-08-05 13:51:20

Sauf si je ne suis pas au courant de quelque chose, d'après ce que je comprends, vous devez avoir une couleur d'arrière-plan que l'image PNG8 peut fondre. Étant donné que mon arrière-plan va changer de façon dynamique, j'ai besoin de l'arrière-plan PNG pour être complètement clair avec la transparence alpha. – seaofinformation

Peut-être que je me trompe, mais je n'ai jamais eu de problèmes avec cette technique. Plus récemment, je ne fais qu'une vérification sommaire dans IE 6, mais les conceptions que j'ai implémentées n'ont pas eu de problèmes de transparence. –

Wow, je me demande pourquoi je ne savais pas à ce sujet avant. J'ai recherché la conversion en PNG8 par le passé, mais pour autant que je sache, la transparence alpha n'était pas totalement supportée ... J'ai trouvé ce site basé sur vos suggestions et j'ai l'impression d'avoir vécu dans l'âge des ténèbres temps avec IE6 png corrections: http://tinypng.org/ Merci beaucoup pour le conseil. – seaofinformation

Correctif PNG sur le nouvel élément

Répondre

Questions connexes