Bonjour à toutes et à tous,

Je m'amuse à créer un sampler pour mobiles avec les langages HTML5, JavaScript et CSS3. Vous trouverez le code ci-dessous.

Code html : 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
36
37
38
39
40
41
42
43
44
45
46
<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
        <title>Sampler</title>
    </head>
    <body>
                <!--Section CSS pour la dimension des boutons-->
 
        <style>
        #hello, #goodbye
        {   height: auto;
            width: auto;
            max-height: 90px;
            max-width: 90px;}
        </style>
 
                <!--Déclaration des boutons-->
 
            <button onclick="myFunction1()"><img src="../img/hello.jpg" id="hello"></button>
            <button onclick="myFunction2()"><img src="../img/good bye.jpeg" id="goodbye"></button>
 
                <!--Déclaration des fichiers audio-->
 
            <audio id="hi">
                <source src="../sounds/hello.mp3">
            </audio>
            <audio id="bye">
                <source src="../sounds/goodbye.mp3">
            </audio>
 
                <!--Script qui lance le son quand on clique sur le bouton-->
 
            <script>
            var audio = document.getElementById("hi");
            function myFunction1(){
            audio.play()
            };
            var audio2 = document.getElementById("bye");
            function myFunction2(){
            audio2.play()
            };
            </script>
    </body>
</html>

J'utilise le logiciel Intel XDK pour compiler mon application et pouvoir me la générer. C'est là qu'intervient la péripétie : lorsque je simule mon code, je n'ai que la structure HTML qui apparaît avec les boutons. Que ça ! Alors que la simulation sur un navigateur web (Firefox pour ma part avec l'onglet de développement) fonctionne parfaitement, aucune erreur de script n'est détectée.

Je suis sûr qu'il doit manquer quelque chose, mais je ne sais guère.

J'espère avoir été assez clair sur ce sujet.

Je compte sur votre grande expérience afin de me prodiguer vos conseils ;-)

Je vous remercie d'avance pour votre aide.

Quentin.