Vérifiez vos informations

Il semblerait que les informations techniques de votre profil n'aient pas été actualisées depuis un certain temps... Pour que l'aide apportée vous soit efficace, il est important que ces informations soient à jour : prenez quelques secondes pour confirmer ou compléter les informations suivantes.


Lien de votre forum
Version de ce forum
Vous êtes le fondateur de ce forum
Vous avez modifié le CSS de ce forum
Vous avez modifié les templates de ce forum
Votre navigateur

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
avatar

Pinguino
Adminactif
Adminactif

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

https://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
avatar

Pinguino
Adminactif
Adminactif

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

https://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
avatar

Pinguino
Adminactif
Adminactif

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

https://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;
}
avatar

Automne
Membre actif

Messages : 8431
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.
avatar

Dr. Karlos
Membre actif

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