High-Tech Santé Médecine Droit-Finances

Auto-Entrepreneur

Comment faire ?

Rechercher : dans
Par :

Besoin d'exemple (CSS + textarea + opacity)

Dernière réponse le 13 oct 2008 à 19:22:21 Edouard73, le 25 sep 2007 à 22:30:20 
 Signaler ce message aux modérateurs

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

Configuration: Windows XP
Firefox 2.0.0.7

Meilleures réponses pour « Besoin d'exemple (CSS + textarea + opacity) » dans :
Changer l'aspect du curseur en CSS VoirLa propriété cursor permet de changer l'aspect du curseur sur un élément d'une page web. Le client affichera automatiquement le curseur de son ordinateur qui correspond au type de curseur que vous aurez choisi. Exemples Liste des attributs...
Une popup d'information au survol sans Javascript ni CSS VoirParfois, il peut être utile d'afficher des informations supplémentaire au survol du curseur sur une zone de l'écran, par exemple "Cliquez pour agrandir" sur une image, un descriptif sur une abbréviation ou des détails sur un lien. On trouve...
Les CSS pour présenter vos images VoirPour présenter agréablement vos images, vous pouvez intégrer quelques codes supplémentaires dans votre CSS et vous en servir à bon escient. Elles sont bien sur modulables en fonction de la charte graphique de votre site. Utilisation Mettez les codes...
Les formulaires HTML VoirIntérêt d'un formulaire Les formulaires interactifs permettent aux auteurs de pages Web de doter leur page web d'éléments interactifs permettant par exemple un dialogue avec les internaute, à la manière des coupons-réponse présents dans certains...
Les classes de style (CSS) VoirLes classes et les ID Les classes Il peut s'avérer intéressant d'affecter des styles différents à des mêmes balises. Pour cela les spécifications CSS ont introduit le concept de classe. La définition des classes est aussi simple que celles des...
Feuilles de style - CSS VoirPrésentation des feuilles de style Le concept de feuilles de style est apparu en 1996 avec la publication par le W3C d'une nouvelle recommandation intitulée « Cascading StyleSheets » (feuilles de style en cascade), notée CSS. Le principe des...
Posez votre question Répondre

1

Dalida, le 26 sep 2007 à 09:29:56

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.
[ Mathieu ]

"Les jeunes c'est l'insécurité
il faudrait tous les enfermer!" BxN 1985

   
Répondre à Dalida

2

Edouard73, le 26 sep 2007 à 14:39:15

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

   
Répondre à Edouard73

3

spaima_zmeilor, le 2 avr 2008 à 09:33:12

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

   
Répondre à spaima_zmeilor

4

Edouard73, le 2 avr 2008 à 14:44:58

Coucou

voila le site : http://www.premiumwanadoo.com/...

les codes sont visibles dans source.

sur cette page il y en un peu plus : http://www.premiumwanadoo.com/...

voilou :)

   
Répondre à Edouard73

5

 rezman, le 13 oct 2008 à 19:22:21

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

   
Répondre à rezman
Posez votre question Répondre
Ils ont besoin de votre aide