Deux exemples de codes html simples directement tapés dans le module texte.
Rollover sur un élément de tableau
Astuce du Jimdonaute "Lefildargent" très utile pour mettre en évidence du contenu dans un tableau : Au survol, la ligne passe en surbrillance.
Légèrement modifié (seconde rangée) de façon à faire apparaître une solution cachée au click dans la dernière cellule.
|
Exemple de Rollover sur tableau par Lefildargent. |
Le code de rollover et le tableau doivent être insérés en widget html | pour exemple |
|
Exemple de CLICK sur tableau |
Remplacez "onmousover" par "onmousedown" dans le code | La réponse cachée |
Le code en clair :
<table class="mceEditable" border="0" width="100%" cellspacing="0" cellpadding="3">
<tbody>
<tr onmouseout="this.style.background='none';" onmouseover="this.style.background='gainsboro';" style="background: none repeat scroll 0% 0% transparent;">
<td>
<strong>Exemple de Rollover sur tableau</strong> <em>par
Lefildargent.</em> <strong><br /></strong>
</td>
<td style="text-align: center;">
<strong>Le code de rollover et le tableau doivent être insérés en
widget html</strong>
</td>
<td>
<em>pour exemple</em>
</td>
</tr>
<tr onmouseout="this.style.background='none';" onmousedown="this.style.background='gainsboro';" style="background: none repeat scroll 0% 0% transparent;">
<td>
<strong>Exemple de CLICK sur tableau</strong> <em>par
Lefildargent.</em> <strong><br /></strong>
</td>
<td style="text-align: center;">
<strong>Remplacez "onmousover" par "onmousedown" dans le
code</strong>
</td>
<td style="color:white";>
<em>La réponse cachée</em>
</td>
</tr>
</tbody>
</table>
"Surligner" une portion de texte
Du très basique, pour rappeler que les balises html du module texte, c'est pratique.
Exemple de texte mis en évidence grâce aux attributs html
Pour mettre une portion de texte en évidence comme ci-dessus voici ce qu'il faut taper dans la fenêtre "modifier de html" du module texte :
<p style="text-align: center; font-size: 100%; font-weight: 500; letter-spacing: 0.05em;"><strong><span style="color: white; padding: 3px 0px 0px 0px; background-color: #005ea7;">Exemple de texte mis en évidence grâce aux attributs html<br /></span></strong></p>
Dans l'ordre, vous avez l'alignement centré, la taille de police, la graisse, l'espacement des lettres, puis dans la balise suivante, la couleur du texte, le padding (qui permet de changer la zone colorée) la couleur d'arrière-plan.
Pour modifier une seule partie d'une ligne, pour un effet "surlignage de texte", il suffit d'inscrire le texte "normal" entre des balises <p>:
ici, les lettres sont entre des balises <p> Ici, elles sont encadrées en <span> par le code déjà cité plus haut. Il est possible aussi de réaliser cela avec des copiés collés, sans passer par le code html, directement dans les modules textes de Jimdo.
<p>texte normal <strong><span style="color: white; padding: 3px 0px 0px 0px; background-color: #005ea7;">Texte surligné</span></strong> texte normal</p>
2 En vertu du paragraphe § 19 de la loi sur les petites entreprises, nous ne prélevons pas et n'affichons pas la TVA.