Vous n'êtes pas connecté. Connectez-vous ou enregistrez-vous

[ ↓ ]

Voir le sujet précédent Voir le sujet suivant Message [Page 1 sur 1]

Milouze14


Fondateur

Milouze14

Message posté: le Ven 14 Oct 2011 - 7:59
Grâce à cette astuce, vous pourrez créer un bouton personnalisé (que nous verrons plus bas ;) ) qui contiendra en cliquant
sur ce dernier un contenu divers ( texte, image, iframe etc etc).

Pour ce fait:
il faut insérer un code javascript sur l'ensemble des pages de votre forum:

Modules/HTML & JAVASCRIPT/Gestions des codes javascript/Créer un nouveau javascript

Créez un nouveau javascript en le nommant par exemple ==>" Afficher_cacher" sur toutes les pages du forum.
Code:
function visibilite(thingId)
{
var targetElement;
targetElement = document.getElementById(thingId) ;
if (targetElement.style.display == "none")
{
targetElement.style.display = "" ;
} else {
targetElement.style.display = "none" ;
}
}




Pensez à valider votre nouveau javascript ;) .

Passons ensuite à la compréhension du code HTML :

Code:

<a href="javascript:visibilite('Identifiant');">
<span class="La class de votre bouton"title="Le texte au survol de la souris">Le texte cliquable</span></a>
<div id="Identifiant" style="display:none"> 
le contenu qui sera affiché lors du clic
 </div>

Décortiquons le code les ami(e)s ;) :
Code:
<a href="javascript:visibilite('Identifiant');">
C'est une partie importante car le script recherchera l'équivalent pour ouvrir le contenu:
donc il faudra avoir : identifiant dans ces deux parties
Code:
<a href="javascript:visibilite('Identifiant');">
et
Code:
<div id="Identifiant" style="display:none">


Pour créer un autre bouton il faudra mettre identifiant1, pour un autre identifiant2 etc etc.

Passons à l’apparence du bouton ;) :
Affichage/Images et Couleurs/Couleurs/Feuille de style

On va donner une apparence au contenu ;)

Code:
.identifiant
{
votre souhait d'apparence
}
 on donne une apparence au bouton ;)
.La class de votre bouton
{
votre souhait d'apparence
}

Voir comment installer un autre hébergeur dans le module de rédaction





Fondateur des forums Milouze14

- Contact par MP -



Voir le sujet précédent Voir le sujet suivant Message [Page 1 sur 1]

[ ↑ ]

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

 
  • © PunBB | Signaler un abus