Archives FluxBB.fr

Les archives de FluxBB.fr

Recherche rapide

Vous n'êtes pas identifié(e).

Version 1.4.13 : [.tar.gz][.zip] (maj 20/10/2014)
Pack langue française pour 1.4.x : [.zip] (maj 06/01/2012)

Branche 1.5.x : fluxbb.org

Version 1.2.24 fr (entièrement en français) : [.zip] (maj 26/08/2011)
Pack langue française pour 1.2.x : [.zip] [.rar] (maj 15/10/2006)

Vous avez un problème ?
Avant de poser votre question sur les forums d'entraide nous vous invitons à consulter :

#1 19-11-2006 21:01:50

Pascal
Membre

image PNG

Pour que vos images png ne soit plus sur un fond marron clair sous IE


mettre dans HEAD

<!--[if lt IE 7]>
<script defer type="text/javascript" src="pngfix.js"></script>
<![endif]-->

créer un fichier pngfix.js avec le code

/*
 
Correctly handle PNG transparency in Win IE 5.5 & 6.
http://homepage.ntlworld.com/bobosola. Updated 18-Jan-2006.

Use in <HEAD> with DEFER keyword wrapped in conditional comments:
<!--[if lt IE 7]>
<script defer type="text/javascript" src="pngfix.js"></script>
<![endif]-->

*/

var arVersion = navigator.appVersion.split("MSIE")
var version = parseFloat(arVersion[1])

if ((version >= 5.5) && (document.body.filters)) 
{
   for(var i=0; i<document.images.length; i++)
   {
      var img = document.images[i]
      var imgName = img.src.toUpperCase()
      if (imgName.substring(imgName.length-3, imgName.length) == "PNG")
      {
         var imgID = (img.id) ? "id='" + img.id + "' " : ""
         var imgClass = (img.className) ? "class='" + img.className + "' " : ""
         var imgTitle = (img.title) ? "title='" + img.title + "' " : "title='" + img.alt + "' "
         var imgStyle = "display:inline-block;" + img.style.cssText 
         if (img.align == "left") imgStyle = "float:left;" + imgStyle
         if (img.align == "right") imgStyle = "float:right;" + imgStyle
         if (img.parentElement.href) imgStyle = "cursor:hand;" + imgStyle
         var strNewHTML = "<span " + imgID + imgClass + imgTitle
         + " style=\"" + "width:" + img.width + "px; height:" + img.height + "px;" + imgStyle + ";"
         + "filter:progid:DXImageTransform.Microsoft.AlphaImageLoader"
         + "(src=\'" + img.src + "\', sizingMethod='scale');\"></span>" 
         img.outerHTML = strNewHTML
         i = i-1
      }
   }
}

Hors ligne

#2 27-08-2008 18:45:10

kewee
Membre

Re : image PNG

Bonjour smile

je suis désolée de demander davantage de détails, mais j'ai beau regarder même les styles proposés, j'ai l'impression que personne n'est parvenu à rendre ses .png transparents sous ie6. Sur un site, no soucy, mais pour le forum que je suis en train de monter je n'y parviens pas.

J'ai placé le

<!--[if lt IE 7]>
<script defer type="text/javascript" src="pngfix.js"></script>
<![endif]-->

dans "header.php", juste après

<link rel="stylesheet" type="text/css" href="style/<?php echo $pun_user['style'].'.css' ?>" />

aurais-je erroré?

dsl encore si ma question est stupide mais je cale dessus depuis un bon moment et je ne sais plus quoi faire là sad


Vous m'avez aidé, à moi de vous rendre la pareille, un peu... enfin... si j'peux quoi big_smile

Hors ligne

#3 28-08-2008 03:00:04

Pandark
Guide

Re : image PNG

<!--[if lt IE 7]>

Ça n'est pris en compte que si le navigateur est internet explorer 7 normalement wink


=>  Plugins | Modifications | Liens utiles   <=
                .._ -Pandark- _..
                Serial Dreamer

Hors ligne

#4 28-08-2008 10:55:18

Regnareb
Habitué

Re : image PNG

Mouais, foutre du Javascript pour ça, c'est vraiment laid, à moins que ce soit un site commercial pour un client, mieux vaut oublier.

La manière la plus simple est encore de fournir un gif au lieu d'un png aux utilisateurs d'IE6, il peut y avoir un peu plus d'aliasing, mais au moins ça leur rappelle qu'ils sont sous IE6 et qu'il serait temps d'en changer big_smile


balise.class {
background-image:url(image.png) !important;
background-image:url(image.gif);
}

Et hop c'est dans la poche smile

Hors ligne

#5 28-08-2008 15:52:00

kewee
Membre

Re : image PNG

Regnareb a écrit :

Mouais, foutre du Javascript pour ça, c'est vraiment laid, à moins que ce soit un site commercial pour un client, mieux vaut oublier.

La manière la plus simple est encore de fournir un gif au lieu d'un png aux utilisateurs d'IE6, il peut y avoir un peu plus d'aliasing, mais au moins ça leur rappelle qu'ils sont sous IE6 et qu'il serait temps d'en changer big_smile


balise.class {
background-image:url(image.png) !important;
background-image:url(image.gif);
}

Et hop c'est dans la poche smile

comment dire ça simplement???

hum
/me s'éclaircit la gorge
je te vénère, tu es mon maître big_smile

Pandark > j'ai essayé toutes les méthodes je crois, mais j'ai beau tout essayer, ie7/ ie6 dans le code ou bien d'autres trouvés sur le net, rien n'y fait huh est-il réellement possible de mettre ce javascript dans punBB? L'avez-vous testé?

Dans tous les cas, merci encore pour la soluce, que je trouve excellente, moi aussi je suis anti ie6 lovers et ça les incitera peut-être à passer à la version supérieure mais sans les pénaliser de manière trop importante siffle .

Dernière modification par kewee (28-08-2008 16:07:08)


Vous m'avez aidé, à moi de vous rendre la pareille, un peu... enfin... si j'peux quoi big_smile

Hors ligne

#6 28-08-2008 19:50:18

Mpok
Néo Admin

Re : image PNG

On peut tout à fait gérer la transparence des png avec ie6, sans javascript.
Il suffit d'utiliser les propriétés "filter" dans un css conditionnel.
(c'est d'ailleurs ce que fait le javascript..)
A noter que cela ne fonctionne que si on déclare explicitement les tailles de l'image dans le css.


Life is a struggle, programming is a suffer.

Hors ligne

#7 28-08-2008 19:57:59

kewee
Membre

Re : image PNG

ok mais... comment? big_smile

et ma question est de savoir si cette astuce, partagée ici, est vraiment valable, et, si oui, comment rendre ce javascript actif ou si c'est une astuce qui n'a jamais été testée et n'est finalement pas utilisable sur punBB

ceci dit l'astuce du dessus me convient, mais j'voulais juste savoir si j'm'y prenais comme un pied ou si y'a une finesse que j'ai pas saisie tongue

en tout cas merci pour ces pistes wink


Vous m'avez aidé, à moi de vous rendre la pareille, un peu... enfin... si j'peux quoi big_smile

Hors ligne

#8 28-08-2008 20:24:32

Mpok
Néo Admin

Re : image PNG

kewee a écrit :

ok mais... comment? big_smile

Par exemple, suivre ce tuto.

C'est beaucoup plus propre de mettre le "filter" dans le css plutôt que de l'appliquer par javascript. En fait, le seul intérêt d'utiliser le javascript, c'est si tu as 50 images transparentes à traiter (et encore..).


Life is a struggle, programming is a suffer.

Hors ligne

#9 28-08-2008 21:08:52

kewee
Membre

Re : image PNG

Mpok a écrit :
kewee a écrit :

ok mais... comment? big_smile

Par exemple, suivre ce tuto.

adresse relevée, merci, ça me servira sûrement ultérieurement big_smile


Vous m'avez aidé, à moi de vous rendre la pareille, un peu... enfin... si j'peux quoi big_smile

Hors ligne

Pied de page des forums