Škály (scale) a možnosti jejich zobrazení

Škály zobrazí vodorovnou lištu s posuvníkem, uživatel může vybrat jednu z hodnot.

 	task T - celková porucha
 	   scale 0 3(0.5)
Zobrazí task a posuvník s hodnotami od 0 do 3, s tím, že lze vybrat hodnoty po kroku 0.5

Škály s popisy hodnot

Některé hodnoty ze škály lze označit slovně. za definicí škály jde po sobě hodnota text_bez_mezer. Text může obsahovat HTML tagy, tak lze první hodnotu podtrhnout <u></u>, další mít kurzívou <i></i> a nebo tučně <b></b>

Zobrazí task s popisy hodnot včetně HTML formátování

Škály se zarovnáním přetékajících popisů hodnot

Pokud slovní hodnoty přetékají panel vymezený pro zobrazení tasku viz výše, lze změnit vnější odsazení škálového elementu zleva a zprava pomocí CSS stylu margin-left a margin-right takto pro všechny škály na obrazovce:text <style>.ui-slider-wrapper{margin-left:10px;margin-right:55px}</style>

Škály se zarovnáním levé hodnoty o 10 pixelů a pravé hodnoty o 55 pixelů od okraje obdélníku tasku.

Škály a jejich panely pod sebou

Další task se škálou se zobrazí pod první škálou v pořadí v jakém je definován.

Tasky se škálama pod sebou

Škály a jejich panely vedle sebe

Task se zobrazí v HTML jako fieldset. Lze upravit CSS styl tohoto elementu tak aby zabíral jen polovinu obrazovky (48%) pomocí dalšího text <style>fieldset{width:48%;float:left;}</style>

Tasky a škály vedle sebe

Panely a různé výšky jejich obsahu včetně škál

Někdy se stane, že výška polí pro tasky je různá od sousední a vzezření je nehezké viz další obrázek.

Je nutné nastavit výšku tasku pevně, např. CSS stylem height pro fieldset

Škály vedle sebe, výška tasku nastavena na 140 pixelů.

Panely s různými barvami pozadí

Pro nastavení různých barev pozadí

  1. nastavit background:inherit pro fieldset

  2. v každém tasku nastavit barvu pozadí např.: #styleform background-color:peachpuff;

PreviousTypy úkolů (task) a jejich prezentaceNextZaškrtávací políčka (checkboxvalues)

Last updated