Accordéon Vertical : changer l'opacité ?

Voir le sujet précédent Voir le sujet suivant Aller en bas

Résolu Accordéon Vertical : changer l'opacité ?

Message par Dlanor le Ven 2 Mar 2012 - 11:36

Bonjour à vous o/
Alors voilà, j'ai installé un accordéon vertical dans ma page d'accueil, et j'aimerais mettre la transparence sur les blocs de texte.

Voilà un screen :
http://www.pixenli.com/images/1330684293051019900.png

J'aimerais donc connaître le code ^^ Merci d'avance ^^


Dernière édition par Dlanor le Lun 12 Mar 2012 - 19:15, édité 1 fois

Dlanor
Nouveau membre

Messages : 6
Inscrit(e) le : 02/03/2012

http://delta-adventure.forumactif.com/
Dlanor a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Accordéon Vertical : changer l'opacité ?

Message par Pinguino le Ven 2 Mar 2012 - 11:54

Bonjour,


Vous devriez poster ici le CSS de votre index en accordéon pour que quelqu'un puisse vous aider !

Cordialement

Smile

Pinguino
Adminactif
Adminactif

Masculin
Messages : 10213
Inscrit(e) le : 02/05/2004

http://www.forumactif.com
Pinguino a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Accordéon Vertical : changer l'opacité ?

Message par Dlanor le Ven 2 Mar 2012 - 12:48

Code:
#pa
{
width: 900px;
border: 2px dotted #000000;
}
#partie1
{
width: 900px;
height: 40px;
overflow: hidden;
background-image: url(http://www.pixenli.com/images/1330681885065342600.png);
border-bottom: 1px dotted #877867;
transform: all;
-moz-transform: all;
-o-transform: all;
-htm-transform: all;
-webkit-transform: all;
transition: 1s;
-moz-transition: 1s;
-o-transition: 1s;
-htm-transition: 1s;
-webkit-transition: 1s;
}
#partie2
{
width: 900px;
height: 40px;
overflow: hidden;
background-image: url(http://www.pixenli.com/images/1330681858019404600.png);
border-bottom: 1px dotted #877867;
transform: all;
-moz-transform: all;
-o-transform: all;
-htm-transform: all;
-webkit-transform: all;
transition: 2s;
-moz-transition: 2s;
-o-transition: 2s;
-htm-transition: 2s;
-webkit-transition: 2s;
}
#partie3
{
width: 900px;
height: 40px;
overflow: hidden;
background-image: url(http://www.pixenli.com/images/1330681979001365600.png);
border-bottom: 1px dotted #877867;
transform: all;
-moz-transform: all;
-o-transform: all;
-htm-transform: all;
-webkit-transform: all;
transition: 2s;
-moz-transition: 2s;
-o-transition: 2s;
-htm-transition: 2s;
-webkit-transition: 2s;
}
#partie4
{
width: 900px;
height: 40px;
overflow: hidden;
background-image: url(http://www.pixenli.com/images/1330681940010832400.png);
border-bottom: 1px dotted #877867;
transform: all;
-moz-transform: all;
-o-transform: all;
-htm-transform: all;
-webkit-transform: all;
transition: 2s;
-moz-transition: 2s;
-o-transition: 2s;
-htm-transition: 2s;
-webkit-transition: 2s;
}
#partie5
{
width: 900px;
height: 40px;
overflow: hidden;
background-image: url(http://www.pixenli.com/images/1330682018047490300.png);
transform: all;
-moz-transform: all;
-o-transform: all;
-htm-transform: all;
-webkit-transform: all;
transition: 2s;
-moz-transition: 2s;
-o-transition: 2s;
-htm-transition: 2s;
-webkit-transition: 2s;
}
#partie1:hover, #partie2:hover, #partie3:hover, #partie4:hover, #partie5:hover
{
height: 400px;
overflow: hidden;
transform: all;
-moz-transform: all;
-o-transform: all;
-htm-transform: all;
-webkit-transform: all;
transition: 2s;
-moz-transition: 2s;
-o-transition: 2s;
-htm-transition: 2s;
-webkit-transition: 2s;
}
.titre
{
display: block;
text-align: center;
width: 900px;
height: 40px;
font-size: 28px;
letter-spacing: 2px;
font-variant: small-caps;
font-family: georgia;
font-weight: bold;
padding-top: 5px;
color: #000000;
text-shadow: 0px 0px 2px #ffffff;
}
.content
{
width: 90%;
margin: auto;
border: 1px dotted #958677;
background-color: #eceae7;
padding: 6px;
color: #715d47;
font-size: 11px;
text-align: justify;
}
Voilà Smile

Dlanor
Nouveau membre

Messages : 6
Inscrit(e) le : 02/03/2012

http://delta-adventure.forumactif.com/
Dlanor a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Accordéon Vertical : changer l'opacité ?

Message par Pinguino le Ven 2 Mar 2012 - 14:58

Re,


dans le partie 3, vous avez collé une vidéo Youtube, pouvez-vous me donner le code "embed" de cette vidéo ?

Cordialement,

Smile

Pinguino
Adminactif
Adminactif

Masculin
Messages : 10213
Inscrit(e) le : 02/05/2004

http://www.forumactif.com
Pinguino a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Accordéon Vertical : changer l'opacité ?

Message par Dlanor le Ven 2 Mar 2012 - 15:07

Code:
<embed pluginspage="http://www.macromedia.com/go/getflashplayer" src="http://www.youtube.com/v/FQ0eMfUr940" width="425" height="315" type="application/x-shockwave-flash" wmode="transparent" quality="high" scale="exactfit"></embed>

Dlanor
Nouveau membre

Messages : 6
Inscrit(e) le : 02/03/2012

http://delta-adventure.forumactif.com/
Dlanor a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Accordéon Vertical : changer l'opacité ?

Message par Pinguino le Ven 2 Mar 2012 - 15:11

@Dlanor a écrit:
Code:
<embed pluginspage="http://www.macromedia.com/go/getflashplayer" src="http://www.youtube.com/v/FQ0eMfUr940" width="425" height="315" type="application/x-shockwave-flash" wmode="transparent" quality="high" scale="exactfit"></embed>

Je pensais que le wmode ne serait pas en "transparent".
Avant le vidéo, vous aviez une image en fond normalement ? vous l'avez encore ou vous l'avez retiré en mettant la vidéo Youtube ?

Cordialement,

Smile

Pinguino
Adminactif
Adminactif

Masculin
Messages : 10213
Inscrit(e) le : 02/05/2004

http://www.forumactif.com
Pinguino a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Accordéon Vertical : changer l'opacité ?

Message par Dlanor le Ven 2 Mar 2012 - 15:15

Non, j'ai conservé toutes mes images de fond. Mais il n'y avait rien avant que je copie cette vidéo ^^

Dlanor
Nouveau membre

Messages : 6
Inscrit(e) le : 02/03/2012

http://delta-adventure.forumactif.com/
Dlanor a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Accordéon Vertical : changer l'opacité ?

Message par Automne le Mer 7 Mar 2012 - 13:29

Bonjour,

Où en-est votre problème ?

Deux solutions :

  • Votre problème est résolu, dans ce cas pensez à nous le signaler en cochant l'icône résolu en éditant votre premier message,
  • Votre problème est toujours d'actualité, et dans ce cas pensez à faire des UP régulièrement, afin de ne pas voir votre sujet délesté,


A bientôt sur ForumActif Smile



bonjour,

Vous devez avoir une classe css .contenu avec dedans background-color: white;

supprimer la et mettre seulement ceci

Code:
.contenu {
    -moz-transition: all 1s ease 0s;
    height: 0;
    opacity: 1;
    overflow: hidden;
    padding: 6px;
    width: 0;
}

Automne
+ Hyperactif +

Messages : 8422
Inscrit(e) le : 22/03/2010

http://gilles570.forumactif.info/
Automne a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Accordéon Vertical : changer l'opacité ?

Message par Dlanor le Ven 9 Mar 2012 - 12:40

Merci de votre aide, mais je ne souhaite pas faire disparaître la couleur de fond, uniquement en changer l'opacité Smile

Dlanor
Nouveau membre

Messages : 6
Inscrit(e) le : 02/03/2012

http://delta-adventure.forumactif.com/
Dlanor a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Accordéon Vertical : changer l'opacité ?

Message par Dr. Karlos le Ven 9 Mar 2012 - 16:40

Bonjour,

Ajoutez à ce code dans votre CSS:
Code:
.content
{
width: 90%;
margin: auto;
border: 1px dotted #958677;
background-color: #eceae7;
padding: 6px;
color: #715d47;
font-size: 11px;
text-align: justify;
}

Ces lignes avant l'accolade fermée:
Code:
opacity: 0.4;
-moz-opacity:0.4;
-khtml-opacity: 0.4;
filter: alpha(opacity=40);
-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=40)";

Si vous modifiez 0.4, modifiez le sur tous les codes. En ce qui concerne les filter, multiplier votre valeur décimale par 100. Wink 0.1 (10) étant visibilité presque nulle et 1 (100) étant visibilité complète.


Cordialement.

Dr. Karlos
+ Hyperactif +

Masculin
Messages : 2623
Inscrit(e) le : 03/01/2012

http://www.forum.forumactif.com
Dr. Karlos a été remercié(e) par l'auteur de ce sujet.

Voir le sujet précédent Voir le sujet suivant Revenir en haut


Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum