Welcome!

By registering with us, you'll be able to discuss, share and private message with other members of our community.

SignUp Now!
  • Guest, before posting your code please take these rules into consideration:
    • It is required to use our BBCode feature to display your code. While within the editor click < / > or >_ and place your code within the BB Code prompt. This helps others with finding a solution by making it easier to read and easier to copy.
    • You can also use markdown to share your code. When using markdown your code will be automatically converted to BBCode. For help with markdown check out the markdown guide.
    • Don't share a wall of code. All we want is the problem area, the code related to your issue.


    To learn more about how to use our BBCode feature, please click here.

    Thank you, Code Forum.

Playing Audio Using Keystrokes: Is It Possible?

Annabelle5893

Gold Coder
I'm wondering, how would I make an app that plays audio files using the keys on the number pad? Specifically, I want to make an app that triggers "Rotary Pulse 1" by pressing 1 on the numeric keypad, all the way up to "Rotary Pulse 0" on the 0 key. A dial tone will be toggled on by pressing the spacebar, which will begin with a "receiver pickup" noise. The dial tone turns off when digits are dialed via the numeric keypad. If you press the spacebar either when the dial tone is on, or after dialing a number, a "Receiver Hang Up" noise will be triggered. With the rotary dial sounds, the dial turning to the fingerhole is triggered at key down, and the release of the dial returning to the resting position will be triggered by releasing of the number corresponding to the fingerhole (1, 2, 3, 4, 5, 6, 7, 8, 9, 0). This will be accompanied by the internal sound of the dial pulses as heard in a telephone. What is the code I would use to make this audio app using HTML?
 
In the original version of Atmosphere Deluxe, made by Vectormedia Software, I'm not sure what source code they used, as they programmed the software with Visual Basic, which isn't exactly accessible to screenreaders. If I were to make each audio link and keystroke a different color, what code would I use to generate colors like blue, green, white, and grey? Is there a comprehensive list of color codes?
I found this for you. Hope it helps

 
I wonder if the color names themselves are the HTML codes.
You should be able to use either the hex value or the name of the color in your css code. There is no "html code" for this.

To set color as background with css class:
.paint-black{
background-color: #000;
background-color: black;
}
<div class="paint-black"></div>


To set background inline:
<div style="background-color: black;"></div>
<div style="background-color: #000"></div>
 
Last edited:
So I could possibly put something like:
Code:
<script>
bgcolor=green
color=light blue
</script>
nope, not as simple as that.
you need to grab the element you are wanting to change, then you can either do one of these:

element.setAttribute('style', 'background-color: green; color: lightblue;');

element.classList.add('nameOfClass');

element.style.color = "green";
 
So the buttons for the dialing keypad in my Virtual Phone app, for example, could be light blue on green.
Code:
<html>
<div id="DTMF" style="visibility: visible;">
<center><p class="TONETYPE">DTMF DIALING TONES</p></center>
<button type="button" id="DTMF1">1</button>
<button type="button" id="DTMF2">2</button>
<button type="button" id="DTMF3">3</button>
<button type="button" id="DTMF4">4</button>
<button type="button" id="DTMF5">5</button>
<button type="button" id="DTMF6">6</button>
<button type="button" id="DTMF7">7</button>
<button type="button" id="DTMF8">8</button>
<button type="button" id="DTMF9">9</button>
<button type="button" id="DTMFStar">Star</button>
<button type="button" id="DTMF0">0</button>
<button type="button" id="DTMFPound">Pound</button>
</div>
</html>
 
So the buttons for the dialing keypad in my Virtual Phone app, for example, could be light blue on green.
Code:
<html>
<div id="DTMF" style="visibility: visible;">
<center><p class="TONETYPE">DTMF DIALING TONES</p></center>
<button type="button" id="DTMF1">1</button>
<button type="button" id="DTMF2">2</button>
<button type="button" id="DTMF3">3</button>
<button type="button" id="DTMF4">4</button>
<button type="button" id="DTMF5">5</button>
<button type="button" id="DTMF6">6</button>
<button type="button" id="DTMF7">7</button>
<button type="button" id="DTMF8">8</button>
<button type="button" id="DTMF9">9</button>
<button type="button" id="DTMFStar">Star</button>
<button type="button" id="DTMF0">0</button>
<button type="button" id="DTMFPound">Pound</button>
</div>
</html>
I mean, if that's how you want to design it, sure
 
The DTMF div would be set to green background, and the buttons, could be blue background, with white color for text...

buttons could be green background with blue text

...all depends on how you want to design it
To make the buttons visible so they can be pressed, am I right when I write:
Code:
style="visibility: visible;"ould
Or should I write something different?
 
To make the buttons visible so they can be pressed, am I right when I write:
Code:
style="visibility: visible;"ould
Or should I write something different?
that works... or
you could just do display:none; to hide, and display: block; to show..

or opacity: 0; to hide, opacity:1; to show.
 

New Threads

Buy us a coffee!

Back
Top Bottom