Derniers sujets*
» [TOUTES VERSIONS]Mise en place automatique décorations
par clost Dim 21 Fév 2021 - 11:37
» [AWESOMEBB] Outils de modération rapide
par Milouze14 Jeu 11 Fév 2021 - 6:04
» [TOUTES VERSIONS] Modifier la couleur des pseudos mentionner dans l'éditeur
par fred9545 Mar 2 Fév 2021 - 21:03
» [EDGE] Auto suggestion de la recherche
par tenrev Ven 22 Jan 2021 - 15:13
» [EDGE] Coloriser la cellule vue dans la liste des sujets ....
par tenrev Mar 19 Jan 2021 - 21:31
» [TOUTES VERSIONS] Utiliser les variables utilisateur/forum
par tenrev Mer 30 Déc 2020 - 16:29
» [PHPBB3] Faire un menu déroulant dans le titre d'un forum ou d'un sous forum
par tenrev Mar 29 Déc 2020 - 12:04
» [PHPBB3] Afficher un bouton de navigation sur le premier et le dernier message
par tenrev Mar 29 Déc 2020 - 11:48
» [TOUTES VERSIONS] Toutes versions Bouton générateur d'iframes
par tenrev Mar 29 Déc 2020 - 11:46
» [TOUTES VERSIONS]Afficher de belles infobulles Tooltipster
par tenrev Mar 29 Déc 2020 - 11:43
» [AWESOMEBB] Ajouter un bouton "S'enregistrer" en haut du forum
par Milouze14 Dim 27 Déc 2020 - 8:39
» [AWESOMEBB] Coloriser les cases Annonces & Notes
par Milouze14 Mer 23 Déc 2020 - 8:17
» [PHPBB2] Séparer les messages
par fanny Lun 21 Déc 2020 - 17:51
» [PHPBB2] Mettre en résolu via la réponse rapide
par fred9545 Dim 20 Déc 2020 - 10:48
» [PHPBB2]Supprimer le tag "Re" sur les messages
par fanny Dim 13 Déc 2020 - 22:22
» [PHPBB2] Mettre une couleur de fond dans le profil des messages
par fanny Dim 13 Déc 2020 - 13:26
» [EDGE] Afficher les forums de la catégorie dans la liste des sujets
par clost Sam 12 Déc 2020 - 10:27
» [TOUTES VERSIONS] Afficher une barre des tâches façon Windows 10 sur votre forum
par Quad Daniel Sam 12 Déc 2020 - 8:53
» [TOUTES VERSIONS] Faire clignoter le chiffre ou le nombre de notification(s) dans la toolbar
par fanny Ven 11 Déc 2020 - 14:32
» [PHPBB2] Afficher un message en haut de sujet lorsqu'il est verrouillé
par fanny Jeu 10 Déc 2020 - 10:36
par clost Dim 21 Fév 2021 - 11:37
» [AWESOMEBB] Outils de modération rapide
par Milouze14 Jeu 11 Fév 2021 - 6:04
» [TOUTES VERSIONS] Modifier la couleur des pseudos mentionner dans l'éditeur
par fred9545 Mar 2 Fév 2021 - 21:03
» [EDGE] Auto suggestion de la recherche
par tenrev Ven 22 Jan 2021 - 15:13
» [EDGE] Coloriser la cellule vue dans la liste des sujets ....
par tenrev Mar 19 Jan 2021 - 21:31
» [TOUTES VERSIONS] Utiliser les variables utilisateur/forum
par tenrev Mer 30 Déc 2020 - 16:29
» [PHPBB3] Faire un menu déroulant dans le titre d'un forum ou d'un sous forum
par tenrev Mar 29 Déc 2020 - 12:04
» [PHPBB3] Afficher un bouton de navigation sur le premier et le dernier message
par tenrev Mar 29 Déc 2020 - 11:48
» [TOUTES VERSIONS] Toutes versions Bouton générateur d'iframes
par tenrev Mar 29 Déc 2020 - 11:46
» [TOUTES VERSIONS]Afficher de belles infobulles Tooltipster
par tenrev Mar 29 Déc 2020 - 11:43
» [AWESOMEBB] Ajouter un bouton "S'enregistrer" en haut du forum
par Milouze14 Dim 27 Déc 2020 - 8:39
» [AWESOMEBB] Coloriser les cases Annonces & Notes
par Milouze14 Mer 23 Déc 2020 - 8:17
» [PHPBB2] Séparer les messages
par fanny Lun 21 Déc 2020 - 17:51
» [PHPBB2] Mettre en résolu via la réponse rapide
par fred9545 Dim 20 Déc 2020 - 10:48
» [PHPBB2]Supprimer le tag "Re" sur les messages
par fanny Dim 13 Déc 2020 - 22:22
» [PHPBB2] Mettre une couleur de fond dans le profil des messages
par fanny Dim 13 Déc 2020 - 13:26
» [EDGE] Afficher les forums de la catégorie dans la liste des sujets
par clost Sam 12 Déc 2020 - 10:27
» [TOUTES VERSIONS] Afficher une barre des tâches façon Windows 10 sur votre forum
par Quad Daniel Sam 12 Déc 2020 - 8:53
» [TOUTES VERSIONS] Faire clignoter le chiffre ou le nombre de notification(s) dans la toolbar
par fanny Ven 11 Déc 2020 - 14:32
» [PHPBB2] Afficher un message en haut de sujet lorsqu'il est verrouillé
par fanny Jeu 10 Déc 2020 - 10:36
Les statistiques du forum
[TOUTES VERSIONS] Afficher un texte dactylographié
Page 1 sur 1 • Partagez
- Milouze14Fondateur

l'astuce consiste a afficher un texte façon machine à écrire ,
le script est assez simple mais complexe sur sa structure d'affichage .
Modules/HTML JAVASCRIPT/Gestion des codes Javascript/Créer un nouveau Javascript
Mettre un titre explicite.
Cocher sur toutes les pages.
Déposez ceci:
- Code:
var text = '
<span class="vert">Texte 1 </span>
<span class="orange">Contenu 1</span>\n
<span class="vert">Texte 2 </span>
<span class="orange">Contenu 2</span>\n
<span class="vert">Texte 3 </span>
<span class="orange">Contenu 3</span>\n
<span class="vert">Texte 4 </span>
<span class="orange">Contenu 4</span>\n
<span class="vert">Texte 5 </span>
<span class="orange">Contenu 5</span>\n
<span class="vert">Texte 6 </span>
<span class="orange">Contenu 6</span>\n
<span class="vert">Texte 7 </span>
<span class="orange ">Contenu 7</span>\n
<span class="vert">Texte 8 </span> \n\t
<span class="orange">Contenu 8</span>\n
<span class="white">Fin</span>\n
';
var currentChar = 1;
var htmltag = false;
var cache = '';
function type() {
var str = text.substr(0, currentChar);
var last = str.substr(str.length - 1, str.length);
if (last != '<' && last != '>' & last != '/') {
$("#consoleText2").html(str);
}
currentChar++;
if (currentChar <= text.length) {
if (last == '<') {
htmltag = true;
} else if (last == '>') {
htmltag = false;
}
if (htmltag) {
setTimeout(type, 1);
} else {
setTimeout(type, 50);//AUGMENTEZ OU DIMINUER LA VITESSE ICI
}
}
}
$(document).ready(function () {
$("#consoleText2").html("");
setTimeout(type, 2000);
});

Dans la feuille de style:
Affichage/Images et Couleurs/Couleurs/Feuille de style
Ceci:
- Code:
/*Le conteneur*/
#console2
{
height: auto;/*NE PAS TOUCHER */
border:1px solid orange;
border-radius: 5px;
background: #000;
padding: 15px 15px;
}
/*Couleur verte*/
#console2 .vert
{
color:green;margin-left:2px;margin-right:2px;
}
/*Couleur orange*/
#console2 .orange
{
color: orange;margin-left:2px;margin-right:2px;
}
/*Couleur blanche*/
#console2 .white
{
color: white;margin-left:2px;margin-right:2px;
}
Pensez à valider les modifications en cliquant sur le bouton

Il ne reste plus que le code html qui ne doit en aucun cas être modifié,
a placer dans n'importe qu'elle partie du forum:
- Code:
<div id="console2">
<pre id="consoleText2"></pre>
</div>
Explications sur la partie principale, l'affichage du texte dactylographié.
Tout se passe ici:
- Code:
var text = '
<span class="vert">Texte 1 </span>
<span class="orange">Contenu 1</span>\n
<span class="vert">Texte 2 </span>
<span class="orange">Contenu 2</span>\n
<span class="vert">Texte 3 </span>
<span class="orange">Contenu 3</span>\n
<span class="vert">Texte 4 </span>
<span class="orange">Contenu 4</span>\n
<span class="vert">Texte 5 </span>
<span class="orange">Contenu 5</span>\n
<span class="vert">Texte 6 </span>
<span class="orange">Contenu 6</span>\n
<span class="vert">Texte 7 </span>
<span class="orange ">Contenu 7</span>\n
<span class="vert">Texte 8 </span> \n\t
<span class="orange">Contenu 8</span>\n
<span class="white">Fin</span>\n
';
Il faudra donc bien laisser les deux simples guillemets avant la première balise span et après la dernière balise span.
Ici:
- Code:
<span class="vert">Texte 1 </span>
<span class="orange">Contenu 1</span>\n
Le texte affiché sera sur la même ligne ce qui donnera:
après ceci:
Texte 1 Contenu 1
- Code:
<span class="orange">Contenu 1</span>\n
- Code:
\n
et ici:
- Code:
<span class="vert">Texte 8 </span> \n\t
<span class="orange">Contenu 8</span>\n
On distingue un saut de ligne puis un autre caractère:
- Code:
\t
Cela correspond à un saut de ligne puis un espace
Ce qui donnera :
Texte 8
Contenu 8
Ensuite l’avantage avec ce petit plugin est que vous pouvez ajouter autant de couleur dans votre feuille de style:
Prenez aussi en compte les caractères spéciaux , il faudra alors les remplacer par les valeurs suivantes:
é : \351
è : \350
ê : \352
à : \340
' : \'
Voila,c'est tout pour le moment

Un soucis direction l'entraide

https://www.milouze14.com/f108-entraide-tous-supports
Dernière édition par Milouze14 le Ven 21 Fév 2020 - 16:43, édité 5 fois
- lmc38510Milouzien
Merci beaucoup !
- mariokMembre regretté
Merci beaucoup !
- InvitéInvité
Merci beaucoup !
- InvitéInvité
Merci Philippe 

- GaeMilouzien
Merci beaucoup !
- AncientsMilouzien
Merci beaucoup !
- InvitéInvité
Merci beaucoup !
- El_MojitoMilouzien
Merci beaucoup !
- damieng59Milouzien
Merci beaucoup !
- SuperSpaceCabMilouzien
Merci bien !
- InvitéInvité
Merci beaucoup !
- msfeettoesMilouzien
Merci beaucoup !
- silas88Milouzien
Merci beaucoup !
- chrisnvidiaMilouzien
Merci beaucoup !
- damieng59Milouzien
Merci beaucoup !
Sujets similaires internes ( 0 )
Aucun sujet
Créer un compte ou se connecter pour répondre
Vous devez être membre pour répondre.
Page 1 sur 1
Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum