JAVASCRIPT - somo la 24: Jinsi ya kutengeneza online keyboard
Katika project hii utakwenda kufunza jinsi utakavyoweza kutengeneza keyboard ya online kwa kutumia javascript
PROJECT YA KUTENGENEZA ONLINE KEYBOARD:
Kama umeshawahi kuona katika huduma za kibenk unaweza kukuta kuwa kuna online keyboard kwa ajili ya kulinda usalama endapo kuna program ambayo inachukuwa taarifa za keyboard kwenye kompyuta ama simu ya mtu.
Program hii tutaitengenza kutokana na program ya calculator ambayo tulishaiona kwenye masomo yaliotangulia.
<html>
<head>
<title>Mafunzo ya javascript</title>
<style>
.button {
font-size: 24px;
padding: 10px;
margin: 5px;
border-radius: 5px;
background-color: #f1f1f1;
color: #333;
border: none;
cursor: pointer;
}
.button2 {
font-size: 24px;
padding: 10px;
margin: 5px;
border-radius: 5px;
background-color: #0bcaec;
color: rgb(0, 0, 0);
border: none;
cursor: pointer;
}
button:hover {
background-color: #ddd;
}
#input {
font-size: 24px;
padding: 10px;
margin: 5px;
border-radius: 5px;
border: 1px solid #ddd;
}
</style>
</head>
</html>
<body>
<textarea id="input"></textarea>
<br />
<button class="button" onclick="addChar('q')">q</button>
<button class="button" onclick="addChar('w')">w</button>
<button class="button" onclick="addChar('e')">e</button>
<button class="button" onclick="addChar('r')">r</button>
<button class="button" onclick="addChar('t')">t</button>
<button class="button" onclick="addChar('y')">y</button>
<button class="button" onclick="addChar('u')">u</button>
<button class="button" onclick="addChar('i')">i</button>
<button class="button" onclick="addChar('o')">o</button>
<button class="button" onclick="addChar('p')">p</button>
<br />
<button class="button" onclick="addChar('a')">a</button>
<button class="button" onclick="addChar('s')">s</button>
<button class="button" onclick="addChar('d')">d</button>
<button class="button" onclick="addChar('f')">f</button>
<button class="button" onclick="addChar('g')">g</button>
<button class="button" onclick="addChar('h')">h</button>
<button class="button" onclick="addChar('j')">j</button>
<button class="button" onclick="addChar('k')">k</button>
<button class="button" onclick="addChar('l')">l</button>
<button class="button2" onclick="addChar('+')">+</button>
<br />
<button class="button" onclick="addChar('z')">z</button>
<button class="button" onclick="addChar('x')">x</button>
<button class="button" onclick="addChar('c')">c</button>
<button class="button" onclick="addChar('v')">v</button>
<button class="button" onclick="addChar('b')">b</button>
<button class="button" onclick="addChar('n')">n</button>
<button class="button" onclick="addChar('m')">m</button>
<button class="button2" onclick="addChar('-')">-</button>
<button class="button2" onclick="addChar('=')">=</button>
<button class="button2" onclick="addChar('/')">/</button>
<br />
<button class="button" onclick="backspace()">Delete</button>
<button class="button" onclick="addChar(' ')">Space</button>
<button class="button" onclick="clearInput()">Clear</button>
<button class="button2" onclick="addChar('?')">?</button>
<button class="button2" onclick="addChar(',')">,</button>
<button class="button2" onclick="addChar('.')">.</button>
<br>
<script>
function addChar(char) {
document.getElementById("input").value += char;
}
function backspace() {
var input = document.getElementById("input");
input.value = input.value.slice(0, -1);
}
function clearInput() {
document.getElementById("input").value = "";
}
</script>
</body>
</html>
...
Jiunge nasi WhatsApp kupata update zetu
Umeionaje Makala hii.. ?
👉1 Tafasiri ya Riyadh Swalihina 👉2 Kitabu cha Afya 👉3 Kitau cha Fiqh 👉4 web hosting 👉5 Madrasa kiganjani 👉6 kitabu cha Simulizi
Post zinazofanana:
JAVASCRIPT - somo la 7: Jinsi ya kutumia logical operator kwenye javascript
Katika somo hili utakwenda kujifunza jinsi ya kutumia logical operator kwenye javascript. Katika somo hili tutakwenda kutumia mahesabu.
Soma Zaidi...Game 2: Jinsi ya kutengeneza tic toc game ya single player kwa kutumia javascript, html na css
Katika post hii utakwenda kujifunza kutengeneza game ya tic toc ya mchezaji mmoja na kompyuta yaani single player
Soma Zaidi...JAVASCRIPT - somo la 20 Jinsi ya kutumia foOfloop kwenye javascript
Katika somo hili utajifunza jinsi ya kutumia forOfLoop. Hii ni aina ya loop ambayo yenyewe inahusisha item zote kwenye array.
Soma Zaidi...Game 1: Jinsi ya kutengeneza game ya tic toc ya wachezaji wawili kwa kutumia html, css na javascript
Katika post hii utakwenda kujifundisha jinsi ya kutengeneza game ya tic toc ya wachezaji wawii kwa utumia html, css na javascript
Soma Zaidi...JAVASCRIPT - somo la 11: function maalumu zinazotumika kwenye string yaani string method
Katika somo hili utakwenda kujifunza baadhi ya function maaumu zinazotumika kwenye string yaani string method.
Soma Zaidi...JAVASCRIPT - somo la 8: Aina za data zinazotumika kwenye javascript
Katika somo hili utakwenda kujifunza kuhusu aina za data ambazo hutumika kwenye javascript
Soma Zaidi...Offline data handle kwa kutumia javascript
Katika somo hili tutaenda kujifunza namna ya kuhifadhi taarifa za mtumiaji endapo mtandao utakuwa haupo ()
Soma Zaidi...JAVASCRIPT - somo la 10: Jinsi ya kuandika object na matumizi yake kwenye javascript
Ksomo hili litakwenda kukufundisha kuhusu object kwenye javascript, kazi zake na sheria zake katika kuiandika.
Soma Zaidi...JAVASCRIPT - somo la 13: Function zinazofanya kazi kwenye array.
Katika somo hili tutakwenda kujifunza kuhusu array pamoja na method zinazohusiana na array. Pia nitakujuza tena kuhusu array ni nini. Utajifunza pia jinsi ya kutengeneza array.
Soma Zaidi...JAVASCRIPT -somo la 1: Kwa nini ni muhimu kujifunza javascript
Katika somo hili utajifunza kuhusu historia ya javacsript pamoja na kazi za javascript. Pia utayajuwa makampuni makubwa yanayotumia javascript.
Soma Zaidi...