Tataluj Rutzijol ri Animasamaj
Ab'anon taq jaloj toq atalun rutzijol animasamaj.
Achi'el chi ri animasamaj yalan tajin niyoke' richin nusamajib'ej ri'.
We man nusamajib'ej ta ri', tatojtob'ej chik nasamajib'ej ri ruxaq.
We man nik'atzin ta chawe, tatzijoj chi qe.
Tasamajij chik ri awokik'amaya'l richin natojtob'ej chik nasamajij ri Thimble.
Richin kicholajem taq sachoj tajaqa' rutemeb'al Rusamajib'al B'anonel pa awokik'amaya'l.
NOTE: we tajin nawokisaj ri rub'anikil Ichinan Okem pa K'amaya'l, tab'ana' utzil tasamajib'ej chik ri relik rub'anikil.
<!-- Tatz'aqatisaj ana'oj wawe' -->
<table> <tr> <th>Jub'i'aj</th> <th>Jub'i'aj</th> </tr> <tr> <td>Retal</td> <td>Retal</td> </tr> </table>
<ol> <li>Ch'akulaj 1</li> <li>Ch'akulaj 2</li> <li>Ch'akulaj 3</li> </ol>
<ul> <li>Ch'akulaj 1</li> <li>Ch'akulaj 2</li> <li>Ch'akulaj 3</li> </ul>
<form action="" method="get"> <label for="first-name">Nab'ey b'i'aj</label> <input id="first-name" type="text" name="firstname"><br> <label for="last-name">Ruk'isib'äl b'i'aj</label> <input id="last-name" type="text" name="lastname"><br> <input type="submit" value="Titaq"> </form>
<script src="script.js"></script>
<!-- Titz'aqatisäx ri <link> retal HTML ayakb'al. Jantape' tib'e pa <head> etal --> <link href="style.css" rel="stylesheet">
<video width="320" height="240" controls> <source src="video.mp4" type="video/mp4"> Man nuk'äm ta ri' ri awokik'amaya'l rik'in ri retal silowäch. </video>
<audio controls> <source src="audio.mp3" type="audio/mpeg"> Man nuk'äm ta ri' ri awokik'amaya'l rik'in ri retal k'oxom. </audio>
/* Tatz'aqatisaj ana'oj wawe' */
p { font-size: 20px; }
.className { background-color: green; }
#idName { background-color: green; }
/* Ri ch'akulal achoq ik'in nisamäj ri wachinïk */ .animated { animation-name: animationName; animation-duration: 4s; animation-iteration-count: infinite; animation-timing-function: ease-out; } /* Ri rub'itz'ib' wachinïk */ @keyframes animationName { 0% { background-color: red; } 50% { background-color: orange; } 100% { background-color: yellow; } }
/* Nab'ey Rub'anikil */ a:link { color: RoyalBlue; text-decoration: none; } /* Tz'eton */ a:visited { color: Orchid; } /* Tzijïl */ a:active { color: OrangeRed; } /* Ch'ikon */ a:hover { text-decoration: underline; }
@media screen and (max-width: 320px) { /* Rub'eyal toq ri ruwa man nik'o ta chi re ri 320 px ruwäch */ } @media screen and (min-width: 321px) and (max-width: 768px) { /* Rub'eyal toq ri ruwa k'o chi kikojol ri 321px chuqa' 768px ruwäch */ } @media screen and (min-width: 769px) { /* Rub'eyal toq ri ruwa nik'o chi re ri 768px ruwäch */ }
@font-face { font-family: myFirstFont; src: url(sansation_bold.woff); font-weight: bold; }
/* Titz'aqatisäx jun ch'ab' chi kiwa chi kijujunal taq ch'akulal rik'in jun class='arrow' */ .arrow::before { content: "→"; background: DodgerBlue; color: white; }
// Tatz'aqatisaj ana'oj wawe'
function sayHello(name) { console.log("Ütz awäch, " + b'i'aj); } sayHello("David");
var names = ["David", "Ch'ob'eto", "Kati"];
var person = { name: "Ch'ob'eto", skills: ["JS", "HTML"] };
var names = ["David", "Ch'ob'eto", "Kati"]; var name; for (var i = 0; i < names.length; i++) { name = names[i]; console.log(name); }
var count = 5; while (count > 0) { console.log(count); count = count - 1; }
var name = "Ch'ob'eto"; if (name === "Ch'ob'eto") { console.log("Ütz awäch, " + b'i'aj); } else if (name === "Kati") { console.log("Ütz awäch, " + b'i'aj); } else { console.log("¡Ütz awäch, winäq!"); }
var name = "Ch'ob'eto"; switch(name) { case "Ch'ob'eto": console.log("Ütz awäch, " + b'i'aj); break; case "Kati": console.log("Ütz awäch, " + b'i'aj); break; default: // K'o tib'an we man nik'ulutäj ta ri aruma console.log("¡Ütz awäch, winäq!"); }
// Ticha' jun ch'akulal rik'in id="button" var element = document.querySelector('#button'); element.addEventListener("click", function() { console.log("Click!"); });
// Ticha' ri ch'akulal rik'in id='alert' var element = document.querySelector('#alert'); element.style.background = "OrangeRed";
Ab'anon taq jaloj toq atalun rutzijol animasamaj.