Besoin d'exemple (CSS + textarea + opacity)

Résolu
Edouard73 Messages postés 139 Date d'inscription   Statut Membre Dernière intervention   -  
 rezman -
Bonjour à tous :)

Apres quelques heures de recherches infructueuses sur le net et dans un ultime espoire je viens demander de l'aide mais surtout des exemples.

Voila j'utilise un gif animé pour l'arrier plan de mes textarea via CSS. dont voici l'exemple :

p {
}
textarea {
font-family:arial, sans-serif;
font-size:100%;
width:100%;
background-color:transparent;
color:black;
filter: alpha(opacity=50);
-moz-opacity: 0.5;
-khtml-opacity: 0.5;
opacity: 0.5;
background-image:url(../../../IMAGE%20FORUM/LISTEDESMEMBRES/tabbg.gif);
}

Le probleme avec les gif animés et d'apres ce que j'ai pu lire, il n'est pas possible de rendre l'arrier plan opaque. J'ai donc trouvé une solution qui me permet avec CSS de rendre le .gif opaque à 50% (je n'utilise pas mng pour cause de compatibilité firefoxe et... je n'ai pas d'éditeur)

filter: alpha(opacity=50);
-moz-opacity: 0.5;
-khtml-opacity: 0.5;
opacity: 0.5;

Mon soucie est que cette fonction rend aussi le text qui se trouve dans le textarea. C'est donc ici que j'aurai besoin d'exemples pour me permetre de rendre uniquement l'image en background de mes textarea opaque.

Dans l'attente d'une ame bien charitable
Bonne soirée à toutes et à tous
Edouard73
A voir également:

2 réponses

Réponse 1 / 2
spaima_zmeilor
 
Salut, Est ce que je peux avoir l'adresse de ton site où tu as utilisé la transparence en CSS? Je vodrias faire des pages avec des poemes en francais et roumain sur un fond de livre ouvert et que l'ecriture se pose sur les pages ouverts du livre
Merci d'avance
0
Edouard73 Messages postés 139 Date d'inscription   Statut Membre Dernière intervention   11
 
coucou

voila le site : https://actualite-premium.fr/

les codes sont visibles dans source.

sur cette page il y en un peu plus : https://actualite-premium.fr/

voilou :)
0
rezman > Edouard73 Messages postés 139 Date d'inscription   Statut Membre Dernière intervention  
 
Salut

tu peux aussi passer par des background-position:

par exemple: 
body{
	background:url("fond.gif");
}
#content{
	margin-right:auto;
	margin-left:auto;
	float:right;
	width:900px;
	background:url('fond.png');
	background-attachment:fixed;
	background-position:0px 0px;
	border:2px black solid;
	background-color:white;
	/*background:url("milieu.gif");
	background-repeat:repeat-y;*/
	text-align:center;
}

ou fond.png est la meme image que fond.gif mais avec une opacité à 0.6.
et cela marche pour IE et Firefox

++

chris
0
Réponse 2 / 2
Dalida Messages postés 6728 Date d'inscription   Statut Contributeur Dernière intervention   922
 
salut,

et si tu mettais ton gif dans une autre balise comme un '<div>' (placée avant mais ne contenant pas le '<textarea>') et que par positionnement tu viennes mettre ton '<textarea>' au dessus.

le '<div>' accueille le gif et il est semi-opaque.
le '<textarea>' a un fond transparent et un texte normal.
il vaut mieux essayer sans qu'il se contiennent, j'ai peur de l'héritage.
-1
Edouard73 Messages postés 139 Date d'inscription   Statut Membre Dernière intervention   11
 
Salut Dalida.

finalement apres avoir tester diver truc c'est ce que j'ai fais :

<div id="ANIMATION12" style="position:absolute; left:82px; top:218px; z-index:1; width: 113px; height: 113px;">
<img src="../../../IMAGE%20FORUM/LISTEDESMEMBRES/annim003.gif" width="113" height="113" style="filter:alpha(opacity=25);-moz-opacity:0.25">
</div>

J'ai mis l'animation gif en calque sur le text area avec opacity 25% ça fait exactement ce que je voulais.

hihi

Merci pour la réponse :)
@bientot
0

Discussions similaires

écrire un rapport de travail
asi -
REGINALD -

3 réponses
quel numéro en italie pour un portable ?
toutine01 -
john -

4 réponses