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>
...
Download App Yetu
Jifunze zaidi, na wasiliana nasi ukiwa na App yetu. Bofya link hapo chini kuweza kuipakua.
Download Now
Umeionaje Makala hii.. ?
👉1 Simulizi za Hadithi Audio 👉2 Bongolite - Game zone - Play free game 👉3 kitabu cha Simulizi 👉4 Sira ya Mtume Muhammad (s.a.w) 👉5 Madrasa kiganjani 👉6 Kitabu cha Afya
Post zinazofanana:
JAVASCRIPT - somo la 12: Function zinazotumika kwenye namba
Katika somo hili utajifunz kuhusu baadhi ya function ambazo hutumika kwenye namba
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 21: Jinsi ya kutumia while loop na do while loop
Katika somo hili tutakwenda kujifunza khusu while loop na do while loop.
Soma Zaidi...
JAVASCRIPT - somo la 14: Jifunze kuhusu event kwenye javascript
Katika somo hili utakwenda kujifunza kuhusu javascript events. Event ni neno la Kiingereza lenye maana tukio wingi wake events kumaanisha matukio. Natumia ni kila ambacho kinatokea kwenye javascript.
Soma Zaidi...
JAVASCRIPT - somo la 3: sheria za uandishi wa code za javascript yaani syntax za javascript
Katika somo hili utakwenda kujifunza sheria ama syntax za kuandika javascript. Hii itakuwezesha kuelwa zaidi code za javascript.
Soma Zaidi...
JAVASCRIPT - somo la 6: Jinsi ya kufanya mahesabu kwenye javascript
Katika somo hili utajifunza kuhusu matendo ya hesabu ambayo ni kugawanya, kujumlisha, kuzidisha na kutoa
Soma Zaidi...
Game 3: Mchezo wa kufikiria namba kwa kutumia javascript
Hii ni game ambayo utafikiria namba, ambayo inatakiwa iwe sawa na namba ambayo game imeiweka.
Soma Zaidi...
JAVASCRIPT - somo la 17: condition statement za if else, else if kwenye javascript
Katika somo hili tutakwenda kujifunza kuhusu condition statemant. Darasa hili ni moja katika madarasa muhimu programming. Katika somo hili tutajifunza kwa vitendo zaidi. Tutatumia mifano ya somo lililo tangulia.
Soma Zaidi...
JAVASCRIPT - somo la 9: Jinsi ya kuandika function kwenye javascript
Katika somo hili utakwenda kujifunza jinsi ya kuandika function kwenye javascript. Utajifunz apia namna ya kuitumia function hiyo
Soma Zaidi...
JAVASCRIPT - somo la 18: Jinsi ya kutumia switch case kwenye javascript
Kwa kutumia mfano huu na iliyotangulia unaweza kuweka masharti kadiri uwezavyo. Tukutane somo linalofuata tutajifunza kuhusu switch statement.
Soma Zaidi...