e-gradiva | HTML | CSS | JavaScript | Načrtovanje | |||||
SERŠ Maribor | Iskanje | Primeri |
Koda: | <script type="text/javascript"> function menjaj1(a) { //seznam barv za izpis (v slovenskem jeziku) var barvas=new Array("\u010Drna","Modra","Rde\u010Da", "Zelena","Oran\u017Ena","Rumena") //seznam barv za spreminjanje sloga CSS (v angleškem jeziku) var barva=new Array("black","blue","red","green", "orange","yellow"); document.getElementById("tekst").style.color=barva[a] document.getElementById("barva_txt").firstChild.nodeValue=barvas[a] } function menjaj2(b) { //velikosti pisav var veli=new Array("10pt","15pt","20pt","25pt","30pt"); document.getElementById("tekst").style.fontSize=veli[b] document.getElementById("velik").firstChild.nodeValue=veli[b] } </script> <form id="izbira"> <h3>Barva pisave</h3> <select id="barve" onchange="menjaj1(this.selectedIndex)"> <option selected="selected">Črna</option> <option>Modra</option> <option>Rdeča</option> <option>Zelena</option> <option>Oranžna</option> <option>Rumena</option> </select> <h3>Velikost pisave</h3> <select id="velikost" onchange="menjaj2(this.selectedIndex)"> <option selected="selected">Zelo majhna</option> <option>Majhna</option> <option>Srednja</option> <option>Velika</option> <option>Zelo velika</option> </select> </form> <p id="tekst"><span id="barva_txt">Črna</span> <span id="velik">10pt</span></p> |
---|---|
Izgled v brskalniku: |
Črna 10pt |
Razlaga: |
Velikost in barvo pisave spreminjamo z dvema spustnima menijema. Posamezne možnosti so znotraj elementa option . Po spremembi možnosti (barve ali velikosti) se kliče funkcija (zamenjaj1 oz. zamenjaj2). Funkcijama se pošlje parameter o izbrani možnosti. S stavkom document.getElementById("tekst").style.color=barva[a] JavaScript spremeni barvo pisave. S stavkom document.getElementById("tekst").style.fontSize=veli[b] pa se spremeni velikost pisave.
|
SERŠ Maribor : Strokovna gimnazija : 2004 : Gregor Jelen