Discussion :

[noviceman]

Bonjour,
j'emploie très peu javascript, donc je suis pô bon du tout dans ce domaine, mais j'ai le besoin d'employer le code "machine à écrire" pour un texte en début de page.
J'ai cherché sur google comment insérer du html dans un texte écrit à l'interrieur du script js, mais pas trouvé... Je vous demande une petite aide pour avaner et comprendre...

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
 
var letexte = 'Bienvenue, bla-bla <a href="#mon_lien">Nom du lien</a>'.

me transcrit le html en toute lettre avec les < et les ", mais ne fait pas le lien...
Comment insérer un lien à la fin de la phrase svp ?
<a href="#mon_lien">Nom du lien</a>
Car le texte est à l'interrieur de script js et aussi je voudrais mettre un <strong>mot</strong> sur un mot...??
Par avance merci...

[SpaceFrog]

mais j'ai le besoin d'employer le code "machine à écrire"

Il serait peut être intéressant de nous montrer ton code de machine à ecrire ...

il est évident que si ce code insère le string lettre àprès lettre ça va poser un souci pour les balises html ...
Il faudra alors parser les string pour inserer la balise html en premier et y inserer le contenu texte ensuite.

[Invité]

Bonjour,
voici un code trouvé ici :

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

<div id="typewriterBox"></div>

Avec jQuery :

Code js :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script type="text/javascript">
    var text = 'Hello World, Boy ! <br /><a href="#mon_lien">Life is Big</a> !'
    var currentChar = 1;
    var htmltag = false;
    var cache = '';
    function typewriter()
    {
        var str = text.substr(0, currentChar);
        var last = str.substr(str.length -1, str.length);
        if(last != '<' && last != '>' & last != '/') {
            $("#typewriterBox").html(str);
        }
        currentChar++;
        if(currentChar <= text.length)
        {
            if(last == '<') {
                htmltag = true;
            } else if(last == '>') {
                htmltag = false;
            }
            if(htmltag) {
                setTimeout(typewriter, 1);
            } else {
                setTimeout(typewriter, 75);
            }
        }
    }
 
    $(document).ready(function() {
        $("#typewriterBox").html('');
        setTimeout(typewriter, 2000); // début d'affichage après 2s
    });
 
</script>

Sans :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
<script type="text/javascript">
    var text = 'Hello World, Boy ! <br /><a href="#mon_lien">Life is Big</a> !'
    var currentChar = 1;
    var htmltag = false;
    var cache = '';
    function typewriter()
    {
        var str = text.substr(0, currentChar);
        var last = str.substr(str.length -1, str.length);
        if(last != '<' && last != '>' & last != '/') {
            document.getElementById('typewriterBox').innerHTML = str;
        }
        currentChar++;
        if(currentChar <= text.length)
        {
            if(last == '<') {
                htmltag = true;
            } else if(last == '>') {
                htmltag = false;
            }
            if(htmltag) {
                setTimeout(typewriter, 1);
            } else {
                setTimeout(typewriter, 75);
            }
        }
    }
 
    function loadtypewriter(){
		document.getElementById('typewriterBox').innerHTML = '';
        setTimeout(typewriter, 2000); // début d'affichage après 2s
    }
	window.onload = loadtypewriter;
</script>

[SpaceFrog]

la souci sera le même ... quand il va arriver sur le string <a ...

[Invité]

Ca fonctionne : http://codepen.io/jreaux62/pen/vHjFu