Revenir en haut Aller en bas
Forum Crea illusion Fantasy


Coucou,

Merci de nous rejoindre sur le forum, j'espère que l'on passera de bons moments ensembles.

Au plaisir de te lire dans les différentes catégories.

Le Staff du forum Crea illusion Fantasy.


Partagez|

Spoiler cacher JS-html

Voir le sujet précédent Voir le sujet suivant Aller en bas
AuteurMessage
avatar
Messages : 6154
Venue : 27/06/2009 Je suis: : Féminin
Né(e) le : 17/09/1963
Age : 54
Je vie à : Lyon
Humeur : Bonne humeur
Mes Points : 9246
Admin

Ptite_Perle
18 - 16
MessageSujet: Spoiler cacher JS-html Mar 23 Mai 2017 - 20:58

Coucou

Voici une autre façon de faire un spoiler

Code Html:
Code:
<!---------------Spoiler-code-html------------------------------------------->
<div class="spoiler"><br />
<input onclick="showSpoiler(this);" type="button" value="Voir-Cacher" />
<div class="inner" style="display: none; margin: 5px 20px;
border: 2px solid yellow; background-color: rgba(0, 0, 0, 0.4);
padding: 10px; border-radius: 10px;"><br /><a>Voici un spoiler !</a>
<p>Pellentesque habitant morbi tristique senectus et netus et
malesuada fames ac turpis egestas. Vestibulum tortor quam,
feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu
libero sit amet quam egestas semper. Aenean ultricies mi vitae
est. Mauris placerat eleifend leo.</p>
</div>
</div>

Code JS:
Code:
<!-----------------Script js------------------------------------------------->
<script type="text/javascript">// <![CDATA[
function showSpoiler(obj)
{
var inner = obj.parentNode.getElementsByTagName("div")[0];
if (inner.style.display == "none")
inner.style.display = "";
else
inner.style.display = "none";
}
// ]]></script>

Code CSS:
Code:
<!------------------Code CSS------------------------------------------------>

/*-----spoiler en CSS-----*/
#layer1 {      
    visibility : visible;      
    position : relative;
}

#layer1 a:active {
    color:red;
}
    
#layer2 {
    width:300px;
    border:1px solid yellowgreen;
    border-radius:10px;
    box-shadow:6px 6px 10px black;
    padding:20px;
    visibility : hidden;      
    position : absolute;  
    
}

#layer2:hover {
    background-color:red;
    color:yellow;
}

 
Revenir en haut Aller en bas
http://www.creaillusionfantasy.com/
AuteurMessage
avatar
Messages : 407
Venue : 16/05/2013 Je suis: : Féminin
Né(e) le : 24/11/1963
Age : 53
Je vie à : Versailles
Humeur : Assez bonne
Mes Points : 1611
Membre V.I.P

Sophie
18 - 16
MessageSujet: Re: Spoiler cacher JS-html Mer 24 Mai 2017 - 15:28
Coucou Perle

Dommage si je peux me permettre de ne pas voir un exemple pour voir ce que ça donne  Embarassed
Revenir en haut Aller en bas
http://www.entre-nous-pub.com/
AuteurMessage
avatar
Messages : 6154
Venue : 27/06/2009 Je suis: : Féminin
Né(e) le : 17/09/1963
Age : 54
Je vie à : Lyon
Humeur : Bonne humeur
Mes Points : 9246
Admin

Ptite_Perle
18 - 16
MessageSujet: Re: Spoiler cacher JS-html Mer 24 Mai 2017 - 16:16
Coucou Sophie

Je viens d'essayer mais pour le forum cela ne fonctionne pas, j'essaierai de trouver un code pour forum

Je le met dans les sites web.

Amicalement
Revenir en haut Aller en bas
http://www.creaillusionfantasy.com/
AuteurMessage
avatar
Messages : 407
Venue : 16/05/2013 Je suis: : Féminin
Né(e) le : 24/11/1963
Age : 53
Je vie à : Versailles
Humeur : Assez bonne
Mes Points : 1611
Membre V.I.P

Sophie
18 - 16
MessageSujet: Re: Spoiler cacher JS-html Sam 27 Mai 2017 - 22:03
Coucou perle

Ok merci Razz
Revenir en haut Aller en bas
http://www.entre-nous-pub.com/
AuteurMessage
Contenu sponsorisé
18 - 16
MessageSujet: Re: Spoiler cacher JS-html
Revenir en haut Aller en bas

Spoiler cacher JS-html

Voir le sujet précédent Voir le sujet suivant Revenir en haut
Page 1 sur 1

Sujets similaires

-
» [Annulée] Demande une page HTML
» [résolu] Lien dans image survolée vers page html
» besion d'aide language html lecteur de musique !! (Résolu)
» Xhtml/css: integrer une video avec html
» fond noir qui n'apparait pas en html résolu

Permission de ce forum:Vous ne pouvez pas répondre aux sujets dans ce forum
Forum Crea illusion Fantasy  :: Sites web-