Voile assombrissant

Résolu/Fermé

Cartman - 21 nov. 2005 à 09:57
cartman1706 Messages postés 279 Date d'inscription jeudi 9 novembre 2000 Statut Membre Dernière intervention 21 juillet 2020 - 22 nov. 2005 à 12:05

Bonjour,

je suis en train de creer mon forum, et je voudrais que pour l'affichage de chaque posts, le fond (du tableau contenant le post) soit legerement assombrit.

car j'ai un fond de page qui contient des motifs et mettre du texte dessus rend sa lecture difficile.

n'y a t-il pas de solution CSS pour mettre ce "voile assombrissant" seulement sur le tableau ??

Merci

A voir également:

16 réponses

Réponse 1 / 16

GallyNet Messages postés 434 Date d'inscription mardi 1 juin 2004 Statut Membre Dernière intervention 15 décembre 2008 386
21 nov. 2005 à 13:41

En utilisant le CSS et une image PNG, il y a moyen de faire ce que tu demande :

table.post {
  background: url(voile.png);
}

avec voile.png qui est une image noir qui a une certaine transparence (en couche alpha).

Sous IE c'est plus compliqué :

table.post {
  background: progid:DXImageTransform.Microsoft.AlphaImageLoader (voile.png, sizingMethod='image');
}

Réponse 2 / 16

cartman1706 Messages postés 279 Date d'inscription jeudi 9 novembre 2000 Statut Membre Dernière intervention 21 juillet 2020 36
21 nov. 2005 à 14:37

ok, donc si j'ai bien compris, je prend une image noir (toute noire) puis je lui applique un filtre Alpha (pour la rendre un peut transparante) puis dans mon tableau, je met la classe "table.post" de facon a ce que ce tableau ait comme image de fond cette image.

est ce bien ca ?

Réponse 3 / 16

GallyNet Messages postés 434 Date d'inscription mardi 1 juin 2004 Statut Membre Dernière intervention 15 décembre 2008 386
21 nov. 2005 à 14:52

A peu de chose près c'est ca :
- l'image ne sera pas forcément noir, un gris peu être mieux
- la couche alpha, faut la mettre avec ton utilitaire de dessin (perso j'utilise paint shop pro )
- tu met pas la class "table.post" à la table mais simplement "post"

Réponse 4 / 16

cartman1706 Messages postés 279 Date d'inscription jeudi 9 novembre 2000 Statut Membre Dernière intervention 21 juillet 2020 36
21 nov. 2005 à 15:03

OK,
ca marche.

Mes craintes sont plutot du coté de l'application "Paint shop pro" que je ne connais pas du tout.
j'ai l'habitude de travailler sous adobe 1ere mais pas sur des images fixes.

crois tu que je peux faire cette image sous Paint ?
Si oui ou non, Comment ?

Est il obigatoire que cette derniere soit en PNG et pourquoi ?

Vous n’avez pas trouvé la réponse que vous recherchez ?

Posez votre question

Réponse 5 / 16

GallyNet Messages postés 434 Date d'inscription mardi 1 juin 2004 Statut Membre Dernière intervention 15 décembre 2008 386
21 nov. 2005 à 15:08

Tu peut pas la faire sous paint, il ne gere pas se que l'on appelle la couche "Alpha".

Dans une image normal (bitmap), tu as trois couches, une pour définir le rouge, une pour le vert et une pour le bleu. Avec la couche alpha, tu ajoute un niveau de transparence.

Faut-il quel soit en PNG ? Il vaut mieux car c'est l'un des format le mieux reconnnu sur les navigateur et qui gere la couche alpha. Le JPG ne gere pas la transparence et le GIF ne gere que la transparence total.

(Au fait attention à la méthode pour IE, je suis pas 100% sur quel fonctionne correctement)

Réponse 6 / 16

cartman1706 Messages postés 279 Date d'inscription jeudi 9 novembre 2000 Statut Membre Dernière intervention 21 juillet 2020 36
21 nov. 2005 à 15:11

est ce que c'est difficile sous Paint shop pro de le faire ???

Réponse 7 / 16

GallyNet Messages postés 434 Date d'inscription mardi 1 juin 2004 Statut Membre Dernière intervention 15 décembre 2008 386
21 nov. 2005 à 15:15

Pas vraiment, tu créer une image de 1px par 1px. Tu lui met une couleur de ton choix (sombre a priori).
Tu choisie l'outil gomme, tu vas dans la fenetre de configuration de l'outil, là tu doit avoir un champs qui correspond à la transparence que tu met à 50 pour tester, t'en profitte pour mettre la taille de la gomme à 1.
Tu clique sur ton pixel est normalement il doit être légérement transparent.
Apres tu fait fichier > exporter > PNG optimisé (si je me souvient bien)
tu vas dans l'onglet transparence et tu coche "transparence d'une couche alpha" et tu enregistre.

Réponse 8 / 16

cartman1706 Messages postés 279 Date d'inscription jeudi 9 novembre 2000 Statut Membre Dernière intervention 21 juillet 2020 36
21 nov. 2005 à 15:19

1px/1px ! ! ! c'est tout petit ! en fait c'est le meme px qui va se repeter en fond sur toute la taille du tableau ! ??

pas besoin donc de faire une grande image qui prendrait a elle seule toute la taille du tableau.

Réponse 9 / 16

GallyNet Messages postés 434 Date d'inscription mardi 1 juin 2004 Statut Membre Dernière intervention 15 décembre 2008 386
21 nov. 2005 à 15:23

Non, pas besoin, ainsi, ton image de 1px/1px peut servir dans tout les cas de taille possible pour ton tableau.

Réponse 10 / 16

cartman1706 Messages postés 279 Date d'inscription jeudi 9 novembre 2000 Statut Membre Dernière intervention 21 juillet 2020 36
21 nov. 2005 à 15:25

ok je te remercie bcp

;-)

Vive les forum et l'entre Aide .....

Réponse 11 / 16

cartman1706 Messages postés 279 Date d'inscription jeudi 9 novembre 2000 Statut Membre Dernière intervention 21 juillet 2020 36
22 nov. 2005 à 09:28

Re-Salut !

Hier j'ai fais ce que tu m'a dis, mais pas moyen d'avoir un resultat !

table.post {
  background: progid:DXImageTransform.Microsoft.AlphaImageLoader (voile.png, sizingMethod='image');
}

ne donne rien !

et

table.post {
  background: url(voile.png);
}

ne marche qu'avec des ".jpg" !

de plus je n'ai pas trouvé la foncion transparence avec "Paint Shop Pro 9" .....

Help me please .....

Réponse 12 / 16

GallyNet Messages postés 434 Date d'inscription mardi 1 juin 2004 Statut Membre Dernière intervention 15 décembre 2008 386
22 nov. 2005 à 09:33

Pour ca j'en suis pas sur, j'ai repris sur un code existant que j'ai modifié :

table.post {
  background: progid:DXImageTransform.Microsoft.AlphaImageLoader (voile.png, sizingMethod='image');
}

Quand a ca :

table.post {
  background: url(voile.png);
}

Si ca marche avec des JPEG, ca devrait aussi marcher avec des PNG. Je sais pas pourquoi ca marche pas.

Sinon, pour Paint shop pro, j'utilise le 7, mais il doit pas y avoir une grande différence : est ce qu'il y a une fenetre de configuration de l'outil ? Si oui il y a quoi comme champs a remplir ?

Au fait tu utilise quel navigateur ????

Réponse 13 / 16

cartman1706 Messages postés 279 Date d'inscription jeudi 9 novembre 2000 Statut Membre Dernière intervention 21 juillet 2020 36
22 nov. 2005 à 09:39

j'utilise IE.

mais pour ce qui est de Paint shop, il y a bien une fenetre de de config mais y'a null part marqué "transparence" ou "alpha", j'ai donc cree une image de 1px sur 1px (tout petit !) j'ai zoomé en *5000 pour y voir quelque chose, j'ai colorié ce pixel² d'une certaine couleur.

ensuite ne voyant pas le parametre "transparence", j'ai joué sur d'autre parametres du genre "opacité" ... mais rien a faire !

alors j'ai essayé simplement d'enregistré ce pixel en ".png" et l'afficher en fond sans effet de transparence. mais rien a faire, ca ne donne rien.

Réponse 14 / 16

GallyNet Messages postés 434 Date d'inscription mardi 1 juin 2004 Statut Membre Dernière intervention 15 décembre 2008 386
22 nov. 2005 à 09:42

"opacité" c'est bien ca !
Et tu dit qu'en changeant l'opacité lors de l'utilisation de la gomme il n'y a rien qui change ? C'est bizarre ca.

Tu as bien une version de IE superieur à 5.5 ?

Réponse 15 / 16

GallyNet Messages postés 434 Date d'inscription mardi 1 juin 2004 Statut Membre Dernière intervention 15 décembre 2008 386
22 nov. 2005 à 10:29

Sinon, essaye de regarder sur cette page :
http://www.toutjavascript.com/main/search.php3?note=123456

Il y a un script pour gérer la couche alpha (mais que sous IE 5.5 et +). Regarde donc si tu arrive a trouvé ton bonheur.

Réponse 16 / 16

cartman1706 Messages postés 279 Date d'inscription jeudi 9 novembre 2000 Statut Membre Dernière intervention 21 juillet 2020 36
22 nov. 2005 à 12:05

ok je regarderrai ca

Merci ;-)

Discussions similaires

ecran avec un voile blanc!

probleme sommet

Voile blanc sur l'écran

Problème écran, image devient trop "blanche"

comment enlever le voile de l'écran

Discussions similaires

Newsletters